부분 또는 전체 페이지를 다시 렌더링하기 위해 페이지 요소 위치 및 형상을 다시 계산하는 프로세스를 리플 로우라고합니다. Reflow는 브라우저에서 사용자 차단 작업이므로 개발자가 리플 로우 수에 대한 리플 로우 수와 다양한 문서 속성 (DOM 깊이, CSS 효율 및 스타일 변경이없는 영향)의 영향을 줄이는 방법을 이해해야합니다. 때로는 리플 로우 페이지의 단일 요소가 부모 요소와 모든 자식 요소를 반영합니다.
리플 로우를 트리거 할 수있는 여러 사용자 작업과 DHTML 변경이 있습니다. 브라우저 창 크기를 조정하고 JavaScript를 사용하여 스타일을 계산하고 DOM에서 삭제 요소를 작성하며 요소 클래스를 변경하면 리플 로우가 트리거됩니다. 일부 작업은 상상력을 넘어서 여러 번 리플 로우를 유발할 것이라는 점은 주목할 가치가 있습니다. 다음 사진은 Steve Souders의 연설에서 나온 것입니다.
위의 테이블에서 트리거 횟수가 트리거 되더라도 모든 브라우저에서 모든 JavaScript 제어 스타일이 리플 로우 트리거 리플 로우가 다른 것은 분명합니다. 동시에, 현대식 브라우저가 리플 로우의 수를 제어하는 데 더 잘하고 더 잘하고 있음을 알 수 있습니다.
Google에서는 여러 가지 방법으로 페이지와 웹 응용 프로그램을 측정하며 REFILOW는 UI를 추가 할 때 고려하는 핵심 요소입니다. 우리는 활기차고 대화식이며 유쾌한 사용자 경험을 전달하기 위해 노력하고 있습니다.
원칙적으로Reflow를 줄이기위한 몇 가지 원칙은 다음과 같습니다.
아래 비디오 (Translation 's Note : YouTube에서 인용 한, YouTube에서 인용하고 볼 수 없습니다. 벽을 탐색하려면 원본 텍스트로 이동하십시오) Lindsey는 리플 로우를 줄이는 몇 가지 방법을 소개합니다.
추가 독서