2023 웹 프레임워크 성능 보고서
(astro.build)- CrUX, HTTP Archive, Core Web Vitals 세개의 데이터셋을 활용
- Astro, Gatsby, Next.js, Nuxt, Remix, SvelteKit 및 Wordpress 까지 비교(웹 시장점유율 43% 니까)
- Google CWV 평가 통과율
- Astro 67% > SvelteKit 45% > Gatsby 39% > Remix 35% > Wordpress 30% > Next.js 27% > Nuxt 20%
- First Input Delay (FID), Cumulative Layout Shift (CLS), Largest Contentful Paint (LCP), Interaction to Next Paint (INP)
- Lighthouse 성능 점수, 중간 값
- Astro 65% > SvelteKit 52% > Remix 46%
- JavaScript Payload 사이즈
- Astro 277KB > SvelteKit 323KB > Remix 568KB
정적 사이트를 만들 일이 생각보다 많은데, 아스트로를 이렇게까지 배척할 이유가 없다.
스벨트킷은 간결한 문법을 가졌지만 솔리드스타트와 달리 아일랜드를 지원하지 않기 때문에 아스트로를 더하는 것이 좋은 보완책이다.
그러나 솔리드 제작자 라이언이 언급하길, 아일랜드는 '여러 방법들 중 하나일 뿐'이다. 시야를 넓혀 각 상황에 맞는 방법을 이용하는 것이 중요하다.
(1) 매우 혼합된 사용 사례를 비교하는 동안 초기 페이지 로드 시 오버인덱싱. Next 및 Nuxt와 같은 일반 프레임워크는 Astro와 같은 프레임워크가 명시적으로 설계된 콘텐츠 중심 "사이트"에 비해 "앱"을 구축하는 데 훨씬 더 자주 사용됩니다.
이러한 다양한 사용 사례는 페이지 로드와 로드 후 상호 작용 속도에 관한 최적화 우선 순위가 크게 다르지만 보고서는 이러한 다양한 사용 사례의 데이터를 무분별하게 혼합합니다.
Astro가 콘텐츠 중심 사이트 구축에 능숙하다는 것을 보여주기 위해 데이터는 사이트와 앱을 함께 비교하는 것이 아니라 서로 다른 fw로 구축된 콘텐츠 중심 사이트만 비교해야 합니다. INP(Interaction to Next Paint)에 대한 언급에도 불구하고 비교에는 여전히 근본적인 결함이 있습니다.
(2) 프레임워크 연령 편향. 이것은 보고서의 끝 부분에 언급되었지만 아마도 더 눈에 띄는 호출이 필요합니다. 특히 최신 Nuxt 3는 Nuxt 2에 비해 상당한 성능 향상을 제공하지만 데이터 세트는 대부분 기존 Nuxt 2 사이트로 구성될 가능성이 높습니다.
성능에 대한 일반적인 웹 개발 역량은 시간이 지남에 따라 진화하므로 FW 시대는 FW 자체보다 더 많은 것과 관련이 있습니다. Next와 Nuxt는 2016년에 출시되었습니다. 당시 개발자들은 일반적으로 최신 성능 모범 사례에 대해 잘 알지 못했고 CWV와 같은 가이드 메트릭은 존재하지도 않았습니다.
(3) 선택/표본 편향. 이 보고서는 데이터 세트의 각 프레임워크에 대해 얼마나 많은 사이트가 검색되었는지 지정하지 않았지만 Astro 사이트의 양은 이전 프레임워크의 일부에 불과할 것이라고 생각합니다.
성능 지향 마케팅을 사용하는 젊은 프레임워크인 Astro의 현재 사용자 기반은 주로 성능에 민감한 얼리 어답터로 구성되는 반면 더 많은 주류 프레임워크는 더 폭넓은 채택으로 인해 평균적으로 성능에 덜 민감한 사용자 기반을 갖게 됩니다. .
나는 Astro가 의도한 사용 사례에 대해 성능이 뛰어나다고 생각하지만 항상 그렇듯이 마케팅 동기와 소금 한 알을 가지고 성능 비교를 수행해야 합니다.