javascript - 웹 개발 학습, 헤드 영역의 스크립트에 대한 의구심

Question

프론트엔드를 혼자 익히기 어려우신 분들은 회사 홈페이지를 확인해보시면 헤드 부분에 다음과 같은 코드가 있습니다.

으아아아

의심 1: 여기서는 단락 알고리즘이 사용되는데, 나중에는 어떤 용도로 사용되나요? 이것은 일반적으로 수행됩니까?
의심 2: 코드는 스크립트 앞에 <script src='https://hm.baidu.com/hm.js?78...'> 문을 동적으로 추가한다는 의미입니다. 그런데 왜 이러는 걸까요? 나는 그것을 테스트하고 동일한 기능을 달성하기 위해 이 코드를 헤드에 직접 추가했습니다. 여러 페이지가 있는 경우 이 코드의 각 페이지에 추가하는 문자 수는 함수의 문자 수보다 적습니다. . 정말 이해가 안 가시나요? ?
내 의심을 명확히 하기 위해 전문가에게 문의하세요. 감사합니다!

Answer 1

저는 유사한 통계 라이브러리를 구현했으며 이 메커니즘에 대한 개인적인 이해를 간략하게 공유하고 싶습니다.

으아악

귀하의 질문은 hm.src 中的链接到 script 标签脚本中，而是先初始化 _hmt 변수를 직접 추가한 다음 스크립트를 추가하는 것이 어떻습니까? 이는 통계 라이브러리의 기능 구현과 관련되어야 합니다. 간략한 소개:

1. _hmt 기본적으로 이는 메시지 대기열 캐시입니다. 이 배열에 삽입되는 내용은 클릭, 슬라이드, 터치 등 모든 유형의 사용자 이벤트입니다. 이 메시지 대기열에 푸시된 이벤트는 통계 라이브러리에 의해 Baidu 통계에 보고됩니다.

2. 이 캐시는 자사 비즈니스 코드에서 JS API를 통한 쓰기를 지원합니다. 예를 들어 Baidu Statistics를 사용하는 개발자는 자신의 JS 코드에서 _hmt.push(xxx) 형식의 논리를 작성하고 사용자 지정 이벤트를 메시지 대기열에 푸시할 수 있습니다.

3. 타사 스크립트도 메시지 대기열에 쓸 수 있으므로 대기열의 배열 변수는 전역적이어야 할 뿐만 아니라 가능한 한 빨리 초기화되어야 합니다. 통계 라이브러리에 보고하는 등의 비즈니스 로직은 실행 전 페이지의 주요 콘텐츠가 로드될 때까지 지연될 수 있습니다.

4. 3의 요구 사항을 충족하기 위해 통계 스크립트 도입 방법은 [먼저 배열을 초기화한 후 통계 스크립트를 동적으로 로드]하는 방식으로 설계되었습니다. 이러한 방식으로 대기열 배열을 로드할 때 페이지에서 직접 인라인 초기화하는 것이 매우 효율적이며 후속 통계 스크립트의 로드가 지연되어 페이지 로드 속도에 미치는 영향이 줄어듭니다.

Answer 2

의심 2: 이것은 Baidu 통계여야 합니다. . .

Answer 3

지침

1. _hmt 변수가 정의되었는지 확인하거나 변수를 정의하세요

2. 동적 로딩. 노드 작업 로딩 < 정적 리소스의 우선순위는 렌더링 페이지에 영향을 미치지 않습니다

테스트

1. 첫 줄은 혼자서 공부할 수 있어요

2. 두 번째 줄에서는 두 가지 로딩 효과를 비교할 수 있습니다.

Answer 4

바이두 통계에 나온 코드입니다.
이유는
"별도의 페이지를 만들고 이 JS코드만 추가했습니다. 뜨는 페이지의 내용은 상담창의 내용입니다."
십자가이기 때문이죠. -domain
크로스도메인이란
남의 물건을 내 집으로 가져가는 방법