Fronteers, the Dutch association of front-end developers, organised the first Fronteers Spring Conference at the beautiful Eye Film Museum in Amsterdam.
Tobias Ahlin talked about the performance of CSS animations. His advice: you should only animate using CSS
filter . These properties are hardware accelerated which greatly improves performance. So if for instance you want to animate an element’s shadow, use pseudo elements that you animate using
opacity, instead of animating
box-shadow on the element itself. See example below:
A great example from Estelle Weyl was about how you can tap into new markets with a fast website. Youtube developers made a 100kb size clone (instead of the normal 1200kb) called Youtube Feather. The result was that they had a lot more traffic coming from regions with low bandwidth internet, such as the African continent and India.
Websites can be a lot faster with HTTP/2, the next version of the HTTP protocol. Tobias Baldauf summarised the differences nicely in the following slide:
Performance in the real world
The closing talk was from Kristian Skold. Even if we want to bring all these performance improvements into practice, a client might not give you budget to build these things. How do you convince clients of web performance benefits to their business? Well, tell them what it does for their bounce rate, conversion rate, order value and session length. Use their current data and plot it against data that predicts the increase in these statistics when their website loads a second faster. Start with small improvements and compare after a month. Once they see the effects and start feeling it in their pocket, they’re bound to give you the go-ahead on more drastic performance enhancements.
We really enjoyed this new edition of Fronteers Conference. The short talks ensured that they where focused and gave you a lot of information about different subjects in a short time. We already look forward to attending the next conference in theater Pathé Tuschinski this fall!