Next.js는 조건부 렌더링과 렌더링되지 않은 HTML의 사전 렌더링을 지원합니까?

Question

Next.js는 특정 버튼을 클릭할 때만 표시되는 페이지에 HTML을 미리 렌더링합니다. 예를 들어 탭이 있는 경우 아직 표시되지 않은 탭의 콘텐츠를 렌더링합니까?

Answer 1

Next.js뿐만 아니라 React의 경우에도 구성 요소를 조건부로 표시하거나 숨기는 방법에 따라 달라집니다. 특히 CSS나 JavaScript로 숨겨진 경우 더욱 그렇습니다. 예는 다음과 같습니다.

으아악

1. 첫 번째 예에서는 isVisible属性设置为false 빈 조각이 렌더링됩니다. 빈 조각은 HTML을 생성하지 않습니다.

2. 두 번째 예에서는 속성에 따라 CSS의 display 속성을 변경했으며 생성된 HTML은 표시되지 않고 HTML에 계속 포함됩니다.