Front-end Performance Master Class

We are a group of front-end fanatics.Together we build the best digital user experience.

De Voorhoede

<H2>Performance matters. <A CLASS="attrlink" HREF="https://wpostats.com/" TARGET="_blank" DATA-MSYS-CLICKTRACK="0" REL="nofollow noopener noreferrer">Research shows performance has a huge impact on conversion and user retention</A>. You as a front-end developer can make a big difference!</H2>
In this masterclass you will learn how to build blazingly fast websites. Step-by-step we will boost front-end performance of a real world example site. We will start with basic optimisations, learn how to automate them and work towards more advanced performance engineering. Along the way you will learn all about how browsers render web pages.
At the end of the day you will leave with a lot of knowledge, slides and hands-on experience, which will empower you in your daily work.
We know a lot about performance. We gave this class several times before. At our clients we try to help them boost performance. For our own website we wrote <A CLASS="attrlink" HREF="https://www.voorhoede.nl/en/blog/why-our-website-is-faster-than-yours/" TARGET="_blank" DATA-MSYS-CLICKTRACK="0" REL="nofollow noopener noreferrer">a blog post</A> about the pursuit of mastering performance and we regularly speak about <A CLASS="attrlink" HREF="https://www.voorhoede.nl/nl/events/" TARGET="_blank" DATA-MSYS-CLICKTRACK="0" REL="nofollow noopener noreferrer">performance at meetups</A>.
Note: we will focus on server-side rendered websites. But you can also apply most optimisations to client-side web apps.
 
<H2>Audience </H2>
(Front-end) web developers.
 
<H2>Prerequisites</H2>
An understanding of HTML, CSS and Javascript.
 
<H2>Duration </H2>
1 day course.
 
<H2>What will you learn</H2>
<UL CLASS="listtype-bullet listindent1 list-bullet1">
<LI>
How business is impacted by performance
</LI>
<LI>
How to sell performance to non techies
</LI>
</UL>
<UL CLASS="listtype-bullet listindent1 list-bullet1">
<LI>
Understand browser rendering and networking
</LI>
<LI>
Analyse front-end web performance
</LI>
<LI>
Understand, design and build for perceived performance
</LI>
</UL>
<UL CLASS="listtype-bullet listindent1 list-bullet1">
<LI>
Control how the browser downloads assets
</LI>
<LI>
Tame browsers by loading assets the way you want
</LI>
</UL>
<UL CLASS="listtype-bullet listindent1 list-bullet1">
<LI>
Quick win performance optimisations
</LI>
<LI>
Advanced performance optimisations
</LI>
</UL>
<UL CLASS="listtype-bullet listindent1 list-bullet1">
<LI>
How HTTP/2 will affect performance
</LI>
</UL>
 
Roughly 50% will be theory and 50% hands-on assignments.
 
<H2>Outline</H2>
<UL CLASS="listtype-bullet listindent1 list-bullet1">
<LI>
Introduction: performance matters, perceived performance 
</LI>
<LI>
Critical rendering path 
</LI>
<LI>
Measuring performance: with Pagespeed Insights, WebPagetest, LIghthouse and Chrome dev tools 
</LI>
<LI>
Basic performance optimisations: caching, gzipping, minification
</LI>
<LI>
Image delivery: WebP, , [srcset], data URI’s
</LI>
<LI>
Web fonts: font subsetting, FOIT vs FOUT, async font loading
</LI>
<LI>
Lazy load JS: [async], [defer], loadJS 
</LI>
<LI>
Lazy load CSS: with critical CSS
</LI>
<LI>
Resource hints
</LI>
<LI>
HTTP/2
</LI>
</UL>
 
<H2>Instructors</H2>
Declan Rek - Declan is De Voorhoede’s very own web performance specialist. He guided companies like eBay and Funda on ensuring they’re faster than their competition. Declan occasionally gives talks on performance and wrote a <A CLASS="attrlink" HREF="https://css-tricks.com/case-study-boosting-front-end-performance/" TARGET="_blank" DATA-MSYS-CLICKTRACK="0" REL="nofollow noopener noreferrer">long article on how to boost performance on CSS Tricks</A>.
Jasper Moelker - Jasper is a front-end architect and partner at De Voorhoede. Great user experiences for everyone are his drive to try new techniques and tools everyday to get the best (perceived) performance. He regularly presents at meetups and the occasional conference. Find him on <A CLASS="attrlink" HREF="https://twitter.com/jbmoelker" TARGET="_blank" DATA-MSYS-CLICKTRACK="0" REL="nofollow noopener noreferrer">Twitter</A> and <A CLASS="attrlink" HREF="https://github.com/jbmoelker/" TARGET="_blank" DATA-MSYS-CLICKTRACK="0" REL="nofollow noopener noreferrer">Github</A>.
 
<H2>Costs & tickets</H2>
Ticket: €235 excl. VAT (€295,51 incl. 21% VAT & eventbrite service costs)
Maximum number of participants: 20
 
<H2>Questions</H2>
Do you still have questions about the workshop? Don't hesitate to ask!
<A HREF="mailto:post@voorhoede.nl" ITEMPROP="email" TARGET="_blank" REL="nofollow noopener noreferrer">post@voorhoede.nl</A>
<A ITEMPROP="telephone" TARGET="_blank" REL="nofollow noopener noreferrer">+31 (0)20 2610 954</A>

Rijnsburgstraat 9

Onze {communityGuidelinesLink} beschrijven wat voor content verboden is op Eventbrite. Als je denkt dat een evenement deze schendt, meld dit dan aan ons, zodat wij het kunnen onderzoeken.

Om andere categorieën van verboden of illegale content te rapporteren, verzend je {link}

Front-end Performance Master Class

Meer evenementen van De Voorhoede

Ontdek meer evenementen van De Voorhoede, van Zakelijk tot andere ervaringen die je misschien leuk vindt.

Nog op zoek naar het juiste evenement?

Ontdek alle evenementen in Amsterdam en filter op datum, categorie en meer om de perfecte match te vinden.

Front-end Performance Master Class

Meer evenementen van De Voorhoede

Ontdek meer evenementen van De Voorhoede, van Zakelijk tot andere ervaringen die je misschien leuk vindt.

Misschien vind je dit ook leuk...

Blader door meer evenementen met verschillende datums, prijzen en formats om je volgende geweldige ervaring te vinden.

Nog op zoek naar het juiste evenement?

Ontdek alle evenementen in Amsterdam en filter op datum, categorie en meer om de perfecte match te vinden.