네이버에서 이루어지는 정보 수집에 대해 들여다보다가, 어쩌다 보니 네이버 브라우징이 빨라지는 결과를 얻어 그 방법을 공유합니다.
네이버는 다양한 경로로 사용자의 정보를 수집하고 있습니다. 그 중 유저가 네이버 웹 사이트의 링크를 누를 때마다 로그를 보내는 스크립트도 있습니다. 네이버 도메인 내의 뉴스, 블로그, 지식인 등 서비스의 모든 링크에 이렇게 로그를 보내는 스크립트가 붙어있습니다. 네트워크 로그를 보시면, 링크를 누를 때마다 이를테면 다음과 같은 주소로 접속하는 것을 확인하실 수 있습니다.
링크의 고유 태그, 사용하는 브라우저의 (스크롤바를 제외한) 화면 너비, 클릭한 좌표 등등이 전송되고, 이 정보를 받아서 서버에서 원래 링크가 가리키던 페이지로 리다이렉트 해주는 듯 합니다.
일종의 hyperlink auditing (이렇게 부르는 게 맞는지 모르겠습니다만.. ) 인 듯 한데 자바스크립트를 이용하여 비슷한 효과를 내고 있는 것 같습니다.
cc.naver.com 서버 자체를 차단하면 링크가 고장나게 됩니다. 다음과 같은 스크립트를 삽입해주면 이러한 로그가 수집되는 것을 막을 수 있습니다.
if (window.addEventListener) { window.addEventListener('DOMContentLoaded', function() { window.clickcr = window.nclk = function() { }; } ); }
clickcr, nclk 가 각각 데스크탑, 모바일 웹에서 링크를 눌렀을 때 호출되는 함수 이름이고, 유저가 클릭할 시 링크의 href값을 순간적으로 이 cc.naver.com/cc 주소로 바꾸는 역할을 하는 것으로 보입니다. (사실 저는 코딩에 대해 잘 몰라서, 현직 개발자 분들께서 더 나은 방법이 있다면 알려주시면 감사하겠습니다)
사용 방법은 여러 가지 있겠습니다.. 저는 Adguard의 규칙으로 추가하여 사용하고 있지만 Greasemonkey 등으로도 가능할 것 같습니다.
그런데 이렇게 하면 네이버 화면 전환 속도가 꽤 향상되는 결과를 얻습니다!
다른 조건은 동일하고 위 스크립트를 삽입했을 때, 삽입하지 않았을 때의 페이지 로딩 타임을 비교한 결과입니다.
Hyperlink Auditing 차단하지 않은 경우 |
Hyperlink Auditing 차단한 경우 |
||
홈 →뉴스 |
뉴스→홈 |
홈 →뉴스 |
뉴스→홈 |
1.56 |
2.02 |
0.99 |
1.52 |
2.16 |
1.97 |
1.11 |
1.48 |
1.6 |
2.01 |
1.03 |
1.74 |
1.55 |
1.91 |
1.06 |
1.58 |
1.55 |
2.24 |
1.18 |
1.55 |
1.75 |
1.96 |
1.35 |
1.58 |
1.54 |
2.01 |
1.12 |
1.55 |
1.6 |
2.24 |
1.12 |
1.54 |
1.54 |
2.29 |
1.27 |
1.76 |
1.58 |
2.2 |
1.18 |
1.57 |
1.643 |
2.085 |
1.141 |
1.587 |
(단위: 초, 파이어폭스에서 캐시를 허용한 상태에서 실험)
페이지 전환속도가 약 0.5초 정도, 25~30% 빨라지는 것을 알 수 있습니다. 아마 이 0.5초가 네이버 로그 서버의 응답을 기다리고 리디렉션 되는 시간일 듯 하네요. 체감상으로도 빨라진 걸 느낄 수 있었습니다. 모바일에서도 마찬가지로 브라우징 속도 향상을 체감할 수 있었습니다.
Hyperlink auditing을 차단하는 것이 네이버에서는 다른 어떤 광고 차단보다도 더 속도를 향상시켜주는 듯 합니다. 네이버에서는 이 정보를 어떻게 가공하여 쓰고 있을지 궁금하군요..
제가 관리하는 필터 리스트에도 규칙을 추가시켜 놓았으니, 애드가드 안드로이드 버전을 쓰신다면 List-KR 필터를 새로 import하셔서 효과가 있는지 테스트해보실 수 있습니다. 네이버를 자주 이용하시는 분께 도움이 되지 않을까 싶네요.
사용하는 법
안드로이드 스마트폰 유저시면, Tempermonkey 앱을 이용하는 방법도 있지만 Adguard 앱에서 쓰시면 브라우저 상관 없이 스크립트를 삽입할 수 있습니다.
- 애드가드 앱을 https://adguard.com 에서 다운받습니다.
- User filter에서 다음 규칙을 추가합니다.
naver.com#%#if (window.addEventListener) { window.addEventListener('DOMContentLoaded', function() { window.clickcr = window.nclk = function() { }; } ); }
- 또는 제가 관리하고 있는 필터를 추가하셔도 됩니다. 방법은 제가 이전에 쓴 글 http://m.clien.net/cs3/board?bo_table=lecture&bo_style=view&wr_id=322751CLIEN 에 있습니다.
유저스크립트를 이용할 수도 있습니다.
- 구글 크롬에서 Tempermonkey 확장 프로그램을 설치합니다. https://chrome.google.com/webstore/detail/tampermonkey/dhdgffkkebhmkfjojejmpbldmpobfkfo?hl=en
- 주소 표시줄 옆의 Tempermonkey 아이콘을 누르시고 Add a new script를 누릅니다. 새 유저스크립트를 추가하는 창이 뜨면, 내용을https://gist.githubusercontent.com/SlowMemory/43bd73c3730a99de437a434efc4e101f/raw/484e9184b1726ceda630a24b3b1f38e9579320e7/userscript.js 에서 처음부터 끝까지 복사 붙여넣기 합니다. 그 후 좌상단에 저장하기 버튼을 누르시면 됩니다.
from CV
from CV
Adguard가 유료 프로그램이긴 하지만 IE에서 유저스크립트를 사용하는 거의 유일한 reliable한 방법인 것 같습니다. 원래는 크로스 브라우저 광고차단 소프트웨어인데, 광고차단에 필요한 여러 코드 인젝션을 활용하여 유저스크립트도 지원하는 듯 합니다.
사실 Adguard를 쓴다면 유저스크립트까지 사용할 필요 없이 더 간단하게 위 모바일 브라우저에서 설명한 대로 규칙을 하나 추가하시면 충분합니다.
쓰시는 방법이 있긴 합니다. Adguard iOS용 앱에 제 필터가 기본으로 들어가 있다고 하던데 제가 안 써봐서 잘 모르겠군요. 여기서도 본문 내용처럼 스크립트 삽입은 지원되지 않습니다.
#CLiOS
안드로이드에서 효과 체감되네요