예를 들어 가면 :
페이지 하단에 도착하면 새 뉴스 기사가로드되고 인터넷 브라우저의 URL이이 다음 기사 기사의 URL로 변경됩니다. 그래서 웹 페이지가 다음 페이지를 거의 즉시로드 할 수있는 방법이 궁금합니다. 예를 들어 다음 뉴스 기사의 웹 페이지를 사전 다운로드 한 다음 웹 페이지를 정말 빠르게로드합니까?
답변:
짧은 대답은 페이지의 클라이언트 측 Javascript 코드가 페이지 하단에 "너무 가까이"있을 때이를 감지하여 서버에 더 많은 데이터를 요청한다는 것입니다.
너무 기술적이지 않으면 전체 웹 페이지를 다시로드하지 않습니다. 대신 해당 페이지의 Javascript 코드가 서버에서 더 많은 데이터를 요청한 다음 새 데이터를 수신하면 해당 데이터를 현재 페이지에 추가합니다. 변경할 필요가없는 페이지 부분은 그대로 유지됩니다.
가장 현대적인 방법은 HTML5 기록 수정 기능 을 사용하는 것입니다. HTML5 기록 수정 기능 은 해당 사이트에서 사용하는 것으로 보입니다.
/second하면 오류가 발생합니다. OP의 뉴스 사이트에서는 발생하지 않습니다. URL을 정확하게 변경하여 공유 할 수 있습니다.
history.pushState그리고 history.replaceState현재 페이지에서 멀리 이동하지 않고 주소 표시 줄에 URL을 변경할 수 있습니다. #something히스토리 API를 사용하면 서버가 생성에 참여할 수있는 "실제"URL을 푸시 할 수 있고 프래그먼트가 완전히 지원되어야한다는 큰 장점을 가지고 URL 프래그먼트 ( ) 를 변경하는 기존의 트릭을보다 현대적으로 대체 합니다. 클라이언트 쪽에서.
무슨 일이 일어나고 있는지 이해하는 큰 열쇠 : 자바 스크립트를 통해 실제로 사용자를 리디렉션하지 않고 주소 표시 줄에 URL을 설정할 수 있습니다. 이것을 실제로 보려면 아래 코드를 지원되는 브라우저의 콘솔에 붙여 넣으십시오. 주소 표시 줄이로 바뀝니다 http://programmers.stackexchange.com/yay.html.
history.pushState(null,null,'/yay.html')이 방법의 장점은 사용자가 스토리를 스크롤 한 후 책갈피를 지정하면 책갈피가 사용자를 보낼 위치를 알게된다는 것입니다. DeviantArt의 무한한 검색 결과 스크롤은이 동작의 좋은 예입니다.
offset특정 거리를 결과 집합으로 건너 뛰는 매개 변수를 수정합니다 . 기본 정렬 순서는 "모든 시간에 인기있는"것으로 보이 므로 결과는 다소 안정적이지만 정렬 순서를 "최신"으로 전환하고 인기있는 항목을 검색하면 확실히 그렇지 않습니다.
End키를 길게 누르면 로딩 과정이 지연됩니다.