DNS 캐시 1.브라우저 캐시의 dns 2.이 컴퓨터host 파일의 맵 3.라우터의 매핑 4.네트워크 서비스 업체의 매핑(로컬 DNS 서버까지) 5.root 도메인 이름 서버 6.최상위 도메인 이름 - 기본 도메인 이름 서버 - 결과 캐시는 로컬 DNS 서버에 있습니다
.https HSTS 정책으로 기본 접근 http 리디렉션:response headers:Strict-Transport-Security:max-age=3153600 모든 요청을 https로 리디렉션합니다. 첫 번째 접근은 설정이 공망에 등록될 수 있는지 모릅니다
원격 서버 요청: TLS 연결 2차 RTT, TCP 3차 악수 RTT,nginx 전송 대응하는 자원에 서버 캐시 검사
TLS RTT 2회 최적화, 브라우저 캐시 대칭 키 1.클라이언트 발송 k1 및 암호화 방안 목록 2.서버 발송 k2, 인증서, 공개 키, 확정된 암호화 방안 3.client 인증 인증서, 공개 키 암호화 k3 발송 4.서버 키 해제 k3 5.클라이언트 서버는 k1 k2 k3 대칭 암호화 통신을 사용합니다
문서 해석 과정의 이벤트 트리거 1 해석 시작 html 문서 트리거readystatechange:load2 DOMContentLoaded 이벤트, 원시 html 해석은 스타일 자원 불러오는 것을 포함하지 않으며,readystatechange:interactive 3load 이벤트를 트리거합니다. 자원 불러오는 것이 끝난 후에는readystatechange:complete를 트리거합니다
defer async 자원의 script는 막히지 않습니다. 일반 script 다운로드가 막힌 다음에 막힌 defer는 html 해석을 먼저 다운로드한 후에 실행합니다. 막힌 것이 없습니다. async가 다운로드된 후에 바로 실행합니다. 막힌 실행 단계입니다
재배치 1.dom의 삭제 검사 2.브라우저 창의 변화 스크롤 3.사용자의 입력 4.dom의 모양 크기 애니메이션 5.다시 배열하면 반드시 다시 그리기 6.영향 범위가 넓기 때문에 고정dom 용기의 크기는 다른dom에 영향을 주지 않는 것이 가장 좋다
다시 그리기 1.dom의 색 배경 2.domborder 스타일은 원각 함몰 3.매번 다시 그리기 전에 requestAnimationFrame 을 실행합니다
// bad
div.style.left = div.offsetLeft + 1 + 'px';
div.style.top = div.offsetTop + 1 + 'px';
// good
var curLeft = div.offsetLeft;
var curTop = div.offsetTop;
div.style.left = curLeft + 1 + 'px';
div.style.top = curTop + 1 + 'px';
dom 오프라인 변경
dom.display = 'none'
// dom
dom.display = 'block'
----
const fragment = document.createDocumentFragment();
// DocumentFragment dom
list.appendChild(fragment);
----
dom， dom
var p = document.getElementById("para1"),
var p_prime = p.cloneNode(true);
절대 포지셔닝 고정 포지셔닝 포지셔닝 포지셔닝 속성은 absolute 또는fixeddom 재배열 소모가 적습니다
