성능 최적화 기술은 사용하면 끝일까

Performance Mistakes | Paul Calvano | performance.now() 2024 - YouTube

Web performance is a complicated topic, but over the years it’s become easier to articulate thanks to incredible advancements in performance features, browse...

여러가지 성능 최적화 할 수 있는데 놓칠 수 있는 부분이나, 아니면 잘못 사용해서 오히려 성능을 느리게 하거나 최적화 하지 못한 경우를 소개하는 영상입니다. 특히 초반에 소개하는 Lazy Loading API나 Speculative loading관련 문제가 많이 생길 수 있으니, 조심해서 잘 사용해야 합니다.

Streaming SSR의 뒷면

Out Of Order Streaming (The Secret Powering Modern React) by Theo Browne

I'm the second-best TypeScript YouTuber. I'm giving a talk on streaming in React and the benefits it brings to applications. Streaming allows for faster perceived loading times by sending partial HTML to the browser, rendering it and waiting for the rest to complete. Server-side loading can cause delays, but this can be improved by caching HTML on a CDN. Streaming HTML in a different order has been a challenge, but there are JavaScript solutions. Optimizing HTML streaming with Suspense and dynamic I.O. can further improve loading times. Using suspense in client-side rendering and addressing challenges with Next.js React model are interesting patterns. Caching can now be done at a more granular level, improving SEO and reducing load on the host server. Rendering on the server is not a big penalty compared to multiple API requests. Thank you all.

Streaming SSR이 HTML Streaming과 JS를 통해서 어떻게 구현되었는지 소개하는 발표입니다. 깊게 파고들지 않고, 라이브 코딩을 통해 어떻게 구현되었는지 살펴보므로, 간단하게 <Suspense>안의 Server Components가 어떻게 제자리로 들어가는지 알 수 있습니다.

Server Functions와 두 관점

Why Server Functions Matter In A Server Component World

A website containing blog posts related to the frontend.

Tanstack Start에서 Server Functions 기능을 출시했습니다. Tanstack Start의 Server Functions 개념과 RSC(사실상 현재는 Next.js)의 Server Functions는 어떻게 다른지, 어떤 장단점을 가지고 있는지 소개합니다. 이 글에서 Server Functions에 관심이 생겼다면 이어서 Server Functions의 장점 글을 추천드립니다.

초기 로드 성능 최적화 알아보기

Initial load performance for React developers: investigative deep dive

Exploring Core Web Vitals, Chrome performance panel, what initial load performance is, which metrics measure it, and how cache control and different networking conditions influence it.

초기 로드 성능 최적화의 모든 것에 대한 글은 아니지만, 초기 로드에 관한 지표(LCP, FCP), 측정 방식, 간단한 해결책을 소개합니다. 친절하게 설명하므로, 간단하게 알아보기에 좋습니다. 이전의 브라우저 캐싱의 종류, 그리고 어떻게 다뤄야 할까에서 더 여러 방식을 다루므로, 보시면 더 좋습니다.