고성능 자바스크립트(High Performance JavaScript) 독해노트 분석_자바스크립트 스킬
- WBOY원래의
- 2016-05-16 18:07:05846검색
1장: 로드 및 실행
브라우저의 JavaScript 엔진은 컴파일러 계층 최적화입니다.
브라우저는 JavaScript 코드를 실행할 때 동시에 다른 작업을 수행할 수 없습니다. ), 이는 <script> 태그가 나타날 때마다 페이지와 기타 스크립트가 과도하게 구문 분석되고 실행되도록 허용한다는 것을 의미합니다(각 파일은 다운로드를 시작하기 전에 이전 파일이 다운로드되고 실행될 때까지 기다려야 함). CSS는 페이지를 렌더링하는 데 사용되며 대화형 동작을 위한 JS(거의 모두)는 <body> <BR> 하단에 배치됩니다. 모든 주요 브라우저에서는 JS의 병렬 다운로드를 허용합니다. <BR>외부 링크 스크립트 수를 줄이면 성능이 향상됩니다(JS 병합) <BR>모든 웹사이트는 지정된 파일을 결합하는 URL을 사용하여 원하는 수의 파일을 얻을 수 있습니다. <BR>defer 속성은 스크립트를 연기할 수 있습니다(IE4 및 FF3.5에서만 지원됨) <BR><STRONG>2장: 데이터 액세스 <br><br>JavaScript에는 4가지 기본 데이터 액세스 위치가 있습니다: Direct 수량, 변수, 배열 요소(숫자로 색인화), 객체 구성원(문자 침대로 색인화). <BR>직접 수량과 지역 변수에 접근하는 것이 가장 빠른 반면, 배열 요소와 객체 멤버에 접근하는 것은 상대적으로 느립니다. <BR>프로토타입 체인의 속성이나 메서드가 깊을수록 액세스 속도가 느려집니다. <BR>일반적으로 JavaScript 성능은 자주 사용되는 객체, 배열 요소, 교차 변수를 로컬 변수에 저장함으로써 향상될 수 있습니다. <BR><STRONG>3장: DOM 프로그래밍 <br><br>DOM 작업은 웹킷 기반 브라우저에서 더 빠른 반면, 다른 브라우저는 innerHTML을 더 빠르게 실행합니다. <BR>DOM에 액세스하고 조작하는 것은 최신 WEB 애플리케이션에서 중요한 부분입니다. 하지만 ECMAScript와 DOM의 두 섬을 연결하는 다리를 건널 때마다 '다리 통행료'가 부과됩니다. <BR>재진입 및 재배치에 주의하세요. <BR>IE: 마우스를 올리면 응답 속도가 느려집니다. <BR><STRONG>4장: 알고리즘 및 프로세스 제어 <BR><BR>여러 속성이 있는 객체를 순회해야 하는 경우가 아니면 for-in 루프를 사용하지 마세요. <BR>스택 오버플로 오류에 대해 알아보세요. <BR><STRONG>5장: 문자열 및 정규식 <br><br>역추적은 정규식 일치 기능의 기본 구성 요소이자 정규식 비효율성의 원인입니다. <BR><STRONG>6장: 반응형 사용자 인터페이스 <br><br>JavaScript 작업을 실행하는 데 100밀리초 이상이 소요되어서는 안 됩니다. <BR>웹 작업자는 새 브라우저에서 지원되는 기능입니다. <BR>사용자 경험에 영향을 미칠 만큼 중요한 JavaScript 코드는 없습니다. <BR><STRONG>7장: Ajax <br><br>JSON은 빠른 구문 분석 속도를 갖춘 경량 데이터 형식입니다. <BR>JS, CSS, IMG를 병합하여 요청 수를 줄입니다. <BR>페이지 로딩 시간을 단축합니다. 페이지의 기본 콘텐츠가 로드된 후 Ajax를 사용하여 해당 보조 파일을 얻습니다. <BR><STRONG>8장: 프로그래밍 연습 <br><br>대부분의 경우 eval()과 Function()은 사용할 필요가 없으므로 사용하지 않는 것이 가장 좋습니다. setTimeout() 및 setInterval()의 경우 첫 번째 매개변수로 문자열 대신 함수를 전달하는 것이 좋습니다. <BR>JavaScript에서 객체와 배열을 생성하는 방법은 여러 가지가 있지만 객체와 배열 리터럴을 사용하는 것이 가장 빠른 방법입니다(객체 속성과 배열 항목이 많을수록 리터럴 사용의 이점이 더 분명해집니다). <BR>작업을 중복하지 마세요: 지연 로딩, 조건부 사전 로딩 <BR>더 빠르기 때문에 네이티브 메소드를 더 많이 사용하세요. <BR><STRONG>9장: 고성능 JavaScript 애플리케이션 구축 및 배포 <br><br>PV(페이지 보기)는 페이지 조회수 또는 클릭수입니다. <BR>특히 사이트를 처음 방문하는 사용자의 경우 페이지를 렌더링하는 데 필요한 HTTP 요청 수를 줄입니다. <BR>자바스크립트 압축. <BR>자바스크립트 캐싱. <BR>콘텐츠 전송 네트워크(CDN) 사용 <BR>10장에서는 주로 Firebug, YSlow 및 일부 성능 분석과 같은 도구를 소개합니다.</script>
브라우저의 JavaScript 엔진은 컴파일러 계층 최적화입니다.
브라우저는 JavaScript 코드를 실행할 때 동시에 다른 작업을 수행할 수 없습니다. ), 이는 <script> 태그가 나타날 때마다 페이지와 기타 스크립트가 과도하게 구문 분석되고 실행되도록 허용한다는 것을 의미합니다(각 파일은 다운로드를 시작하기 전에 이전 파일이 다운로드되고 실행될 때까지 기다려야 함). CSS는 페이지를 렌더링하는 데 사용되며 대화형 동작을 위한 JS(거의 모두)는 <body> <BR> 하단에 배치됩니다. 모든 주요 브라우저에서는 JS의 병렬 다운로드를 허용합니다. <BR>외부 링크 스크립트 수를 줄이면 성능이 향상됩니다(JS 병합) <BR>모든 웹사이트는 지정된 파일을 결합하는 URL을 사용하여 원하는 수의 파일을 얻을 수 있습니다. <BR>defer 속성은 스크립트를 연기할 수 있습니다(IE4 및 FF3.5에서만 지원됨) <BR><STRONG>2장: 데이터 액세스 <br><br>JavaScript에는 4가지 기본 데이터 액세스 위치가 있습니다: Direct 수량, 변수, 배열 요소(숫자로 색인화), 객체 구성원(문자 침대로 색인화). <BR>직접 수량과 지역 변수에 접근하는 것이 가장 빠른 반면, 배열 요소와 객체 멤버에 접근하는 것은 상대적으로 느립니다. <BR>프로토타입 체인의 속성이나 메서드가 깊을수록 액세스 속도가 느려집니다. <BR>일반적으로 JavaScript 성능은 자주 사용되는 객체, 배열 요소, 교차 변수를 로컬 변수에 저장함으로써 향상될 수 있습니다. <BR><STRONG>3장: DOM 프로그래밍 <br><br>DOM 작업은 웹킷 기반 브라우저에서 더 빠른 반면, 다른 브라우저는 innerHTML을 더 빠르게 실행합니다. <BR>DOM에 액세스하고 조작하는 것은 최신 WEB 애플리케이션에서 중요한 부분입니다. 하지만 ECMAScript와 DOM의 두 섬을 연결하는 다리를 건널 때마다 '다리 통행료'가 부과됩니다. <BR>재진입 및 재배치에 주의하세요. <BR>IE: 마우스를 올리면 응답 속도가 느려집니다. <BR><STRONG>4장: 알고리즘 및 프로세스 제어 <BR><BR>여러 속성이 있는 객체를 순회해야 하는 경우가 아니면 for-in 루프를 사용하지 마세요. <BR>스택 오버플로 오류에 대해 알아보세요. <BR><STRONG>5장: 문자열 및 정규식 <br><br>역추적은 정규식 일치 기능의 기본 구성 요소이자 정규식 비효율성의 원인입니다. <BR><STRONG>6장: 반응형 사용자 인터페이스 <br><br>JavaScript 작업을 실행하는 데 100밀리초 이상이 소요되어서는 안 됩니다. <BR>웹 작업자는 새 브라우저에서 지원되는 기능입니다. <BR>사용자 경험에 영향을 미칠 만큼 중요한 JavaScript 코드는 없습니다. <BR><STRONG>7장: Ajax <br><br>JSON은 빠른 구문 분석 속도를 갖춘 경량 데이터 형식입니다. <BR>JS, CSS, IMG를 병합하여 요청 수를 줄입니다. <BR>페이지 로딩 시간을 단축합니다. 페이지의 기본 콘텐츠가 로드된 후 Ajax를 사용하여 해당 보조 파일을 얻습니다. <BR><STRONG>8장: 프로그래밍 연습 <br><br>대부분의 경우 eval()과 Function()은 사용할 필요가 없으므로 사용하지 않는 것이 가장 좋습니다. setTimeout() 및 setInterval()의 경우 첫 번째 매개변수로 문자열 대신 함수를 전달하는 것이 좋습니다. <BR>JavaScript에서 객체와 배열을 생성하는 방법은 여러 가지가 있지만 객체와 배열 리터럴을 사용하는 것이 가장 빠른 방법입니다(객체 속성과 배열 항목이 많을수록 리터럴 사용의 이점이 더 분명해집니다). <BR>작업을 중복하지 마세요: 지연 로딩, 조건부 사전 로딩 <BR>더 빠르기 때문에 네이티브 메소드를 더 많이 사용하세요. <BR><STRONG>9장: 고성능 JavaScript 애플리케이션 구축 및 배포 <br><br>PV(페이지 보기)는 페이지 조회수 또는 클릭수입니다. <BR>특히 사이트를 처음 방문하는 사용자의 경우 페이지를 렌더링하는 데 필요한 HTTP 요청 수를 줄입니다. <BR>자바스크립트 압축. <BR>자바스크립트 캐싱. <BR>콘텐츠 전송 네트워크(CDN) 사용 <BR>10장에서는 주로 Firebug, YSlow 및 일부 성능 분석과 같은 도구를 소개합니다.</script>
성명：
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.