Boosting Web Performance in 2023
- On the web
- On Twitter
- Get a ticket
- 🧑🏫 A full day of teaching in a small group
- 🏅 Digital certificate
- 🍵 Tea, coffee, snacks and drinks during the whole day
- 🥪 Lunch
- 📒 Paper and pen/pencil
Full-day in-person workshop • Fri, May 26, 2023.
Even heavy, framework-driven, legacy-haunted apps can get into the green Core Web Vitals and great Lighthouse scores. With partial hydration, critical rendering, clean CSS architecture, Qwik, AVIF, service workers, web workers, predictive prefetching and a dash of client hints, resource hints and early hints, we just need to apply the right performance strategy to get there.
So how do we do that? Let’s figure out the best way to compress text, optimize images, manage web fonts, streamline delivery of CSS/JS, deal with caching and CORS issues, and deliver and contain third-party scripts. We’ll explore ways to refactor and re-organize our legacy code base, and how and when to use Web workers and Webassembly. Oh my, in the workshop, we’ll cover it all.
In this workshop, Vitaly Friedman, co-founder of Smashing Magazine and front-end/UX consultant, will be looking into the optimal front-end performance optimization strategy in 2023, with new challenges and new opportunities, and how we can utilize all of those wonderful shiny web technologies we have available today to boost our websites and apps.
We’ll also explore how to boost debugging in DevTools, how to read network waterfalls and how to make best use of caching and server warm-ups. Beware: you won’t be able to unlearn the things that you’ll learn in the workshop!
Who Is This Workshop For?
In This Workshop, We Will Explore:
- Text compression, for the delivery of plain text and SVG assets with Brotli,
- Image and video optimization, techniques, tooling and formats (AVIF, AV1),
- Bulletproof web font loading, with strategies and techniques, self-hosting and CDNs,
- How to organize, deliver and maintain CSS, and how to reduce and tame the size of CSS, and how to deal with specificity wars, leaking styles and global scope,
- How to manage critical CSS/JS to optimize delivery to minimize reflows,
- 3rd-party scripts, how to identify and visualize performance bottlenecks, deal with tag managers and optimize performance,
- SSR + CSR, and how to navigate the space, with resumability, Qwik and Jamstack, prerendering and static rendering, static site generators and where and how they fit,
- Service Workers, setting up a strategy for better caching and better performance,
- HTTP Caching, CORS, HTTP2/HTTP3, networking, mobile performance gap and things to keep in mind around providing faster experiences to mobile devices,
- Refactoring and debugging strategies,
- Maintenance issues and dealing with legacy browsers,
- Component-based workflow and tooling,
- Common front-end challenges and solutions and important new challenges and opportunities to keep in mind.
What Hardware/software Do You Need?
To get the most out of the workshop, you’ll need to bring a laptop with your preferred text editor.
About Vitaly Friedman
Vitaly loves beautiful content and does not give up easily. Born in Minsk, Belarus, he studied computer science and mathematics in Germany. While writing algebra proofs and preparing for software engineering at nights in the kitchen, at the same time he discovered passion for typography, interface design and writing.
His curiosity drove him from interface design to front-end to performance optimization to accessibility and back to user experience over all the years.
Time & Location
This full-day workshop will be hosted at Fort Mason and will take place the day after SmashingConf. The workshop will be running from 9:30 AM to 5:30 PM on Friday, May 26, 2023.
Schedule for May 26, 2023
9:00 AM – Doors open, Registration
9:30 AM – Introduction & Kick-off
11:00 AM – Coffee Break
1:00 PM – Lunch
2:00 PM – Afternoon Session
3:30 PM – Coffee Break
5:30 PM – The End
Save 100 USD when signing up for the conference and a workshop!