spa에서는 껍데기만 갖고있는 html파일과 스타일시트(css), 상대적으로 큰 js파일이 하나 존재하는데,
모든 페이지의 내용을 첫 로딩때 모두 불러오는것이다. (코드스플리팅이 안되어있다면)
미리 보여질 필요도 없는 내용을 미리 불러오는 것이기 때문에, 첫 로딩이 상대적으로 길게 느껴집니다.
극단적으로 앱이 너무 거대해져서 3초를 넘어가게되면 떠나가는 사용자들이 많이 생길텐데,
한명 한명이 미래의 수입이 될 사용자를 놓쳐선 안됩니다.
SEO
서버에서 렌더링하는 방식과는 다르게, js가 로딩되고 난 후 js코드에 따라 dom이 생성됩니다.
js엔진이 없는 크롤러는 빈껍데기만있는 템플릿을 크롤링하기때문에, spa는 검색에서 불리한 위치입니다.
물론 구글같은 경우에는 크롤러에 js엔진이 내장되어있어서 문제없는데, 네이버는 js엔진이 없다고하네요.
우리나라 특성상 네이버검색을 포기하기에는 아직 조금 이르기때문에, 서버렌더링을 고려해야합니다.
위와 같은 문제를 해결하기 위해서는 pre-render, ssr이라는 두가지방법으로 해결할수있습니다.
여기서는 pre-render를 먼저 소개하겠습니다.
말 그대로 미리 렌더링하는 방식인데, 첫 페이지와 검색해서 나와야하는 페이지에 적용시키게되면, 앞선 2가지 문제를 해결할 수 있습니다.
그리고 ssr보다 구현이 상대적으로 간편합니다.
spa로 구현된 웹을 ssr방식으로 전환하려면, 굉장히 까다롭습니다.
직접 ssr을 구현할수있겠지만, 개발자가 충분하지않다면 결국 또 다른 프레임워크를 도입해야하거든요.
또 다른 프레임워크를 도입하면, 그 프레임워크의 api를 봐야하고..
안정성있는지 확인하고 테스트해봐야하고.. 겉으로는 별로 바뀌는게 없어보이는데 시간이 꽤 소요되죠.
그리고 정적파일 호스팅만 하면 되는 spa와는 달리 조금 더 복잡하고 귀찮은 서버환경도 필요하게 되죠.