TTI, TTV, document.on
~~~~, document.ready()~~~~
를 정확히 알고 있다면, 당신은 Next 할만 할 것이다.
시작글
- 먼가 거창하게 적었지만 별거 없습니다.
- 검색해보면 잘 나오겠지만 간단히 설명합니다.
TTV(Time To View) 유저가 화면을 보기 시작하는 시점
TTI(Time To Interact) 유저와 상호작용(이하 동작) 시작하는 시점
document.on(or ready) JS가 동적 행동 하는 시점
약간씩 차이가 있습니다. 그렇게 적기도 했고, 그렇습니다.
JS가 ES5버전 이전 시절에는 Jquery라는 녀석을 써서 동적 생성을 했습니다.
- 이것은 정확히 저는 뭐라 부르는지 모르겠습니다. 정적인 페이지에 동적인 JS 넣은것? 이죠
여기서 우리가 주목 해야 할 점은 화면과 동작이 서로 다른 시점, 같은시점에 생길수 있다는 것이죠.
그럼 NEXT JS?
- SSR(Server-Side Rendering) : 만들어진 페이지를 가지고 있는게 아니라 요청에 따라 화면을 생성하여 유저에게 전달
- 그렇다고 SSG(Static Site Generator : 이미 만들어진 같은 페이지)도 설정하면 사용 가능하다.
즉 NEXTJS는 TTI와 TTV를 고려하여 화면 구성-설계가 가능하다.
먼저 보여야 하는 화면 -> SSG 형식
SPA처럼 보이고 요청에 따라 동작 해야 하는 경우 SSR 등 가능하다.
반박시 그 주장도 맞음.
개인적인 이해 상태
처음 스마트폰(이하 폰) 나왔을 때 생각 해보면 이해가 빠를거 같다.
폰에서 어플 하나 키면 로딩화면이 나오고 기다리면 각종 동작을 한 화면에서 처리가 가능하다.
폰게임을 할때 화면이 전환이 일어나는 경우는 드물었다.
대신 로딩화면은 잘 나왔다. 그런 상태로 기다렸다 JS파일을 받은뒤 동작 하는 형태이다.
옛날 spring으로 SSR을 하고 컨테이너로 모든 파일을 다 준비한 상태로 개발했다.
지금은 비슷한 다른 개념을 사용해서 내가 많이 헷갈렸다.
참조 링크
https://www.youtube.com/watch?v=iZ9csAfU5Os&t=357s
https://www.daleseo.com/spa-ssg-ssr/
https://dinfree.com/lecture/backend/javaweb_2.2.html
