Web Performance is important for user experience and business metrics. Estimating its impact is key to be able to prioritize it, yet it’s difficult to quantify its benefits until the work has been done.
We need to break this chicken-and-egg loop. This post explains several ways of assessing the potential performance gains with little effort and, more importantly, without actually implementing fixes.
In the past I have been too naive thinking that every stakeholder would care as much as I do about web performance. “Look, there are many case studies proving a correlation between loading time and business metrics!” —…
Before joining Facebook as a Solutions Engineer I had many questions about what the role implied and if it was a good fit for me. After almost one year into the role I wanted to share more about what we do and inspire you.
I had been working as a software engineer for 10+ years, mainly building web applications. I was starting to feel that I didn’t enjoy dedicating 100% of my time to coding anymore, and wanted to understand why I was building what I was building.
What kind of metrics was I trying to move? How did I…
As Progressive Web Apps make their way on desktop I wanted to talk about why I consider this is a breakthrough. I have talked in the past about different uses cases for PWA. In this post I want to focus on PWAs for desktop.
The current version of Google Chrome stable is Chrome 73. This version lets you install Progressive Web Apps natively on macOS. You can find more information about the release on Pete LePage’s “New in Chrome 73” notes.
Poor performance leads to exclusion. When we create heavy sites we limit what users can access our content. Those with more powerful devices and better network will get sites loaded faster. Those with older devices and slower network will need to wait more.
Study after study shows how slowing sites down results in less engagement, less time on the site and a general decrease in key business metrics. Still, in our development teams we continue to prioritize more highly shipping features over addressing web performance.
Don’t get me wrong, features are important. Serving an empty site is fast, but not…
On this post I will describe several use cases where Progressive Web Apps (PWA) can be useful to make your website achieve better performance and be more reliable.
If you are a web developer you have probably heard about Progressive Web Apps (PWA). Web sites that load quick, are reliable, feel smooth and take advantage of modern APIs.
There is a lot of buzz about them, partly because Google coined the term and has been leading the implementation of the bits and pieces that composed it.
Implementing a PWA or adapting an existing site to “become a PWA” looks like…
Scalable Vector Graphics (SVG) are ideal to show logos and drawings on the web due to their small size. SVGs also have other useful applications, such as placeholders for lazy loaded images and animations. In a past post I also explained how to optimize a SVG with several tools that remove unneeded code and simplify shapes.
Even if we optimize our SVG assets, we can still make mistakes delivering that SVG to the browser. …
Performance is a topic that has interested me for a long time. I remember when I learned about dynamic programming, greedy or divide and conquer algorithms. There was something gratifying in taking a code that takes minutes to run and make it run in a handful seconds.
Moving over to web, the performance problems are different. Usually, they are not related with computational complexity, but about serving what’s needed when needed in the best possible way. It might seem like a no-brainer, but it’s more difficult than it seems.
Steve Souders was one of the first in reverse-engineering how browsers…
Componentization has marked a before and after in web development. The main advantages that are usually mentioned are reusability and modularization. Components are well defined pieces that we can use to build our sites, like bricks of Legos. It turns out this component structure provides a great foundation to improve the performance of our sites.
We are explicit about our dependencies, so we know what code we need to run a specific component. Lazy-loading and bundle splitting can have a huge impact on page performance: less code requested, parsed, and executed. …
I was browsing Tim Kadlec’s website and I noticed it showed the time it took the page to load in the footer.
Stoyan Stefanov also realized and wrote “This page loaded in X seconds”, a blog post describing the code used for this. Stoyan also created a bookmark that shows an alert with the load time of the current page. The data is obtained from
I liked the idea and added a similar snippet that shows the page load time in the footer on my site (you should see it if you scroll to the bottom).
I love hand-drawn graphs and I have always fantasized about applying it to vector images. That’s why I was very happy to find out about RoughJS, a library that draws primitives like lines, curves, arcs, polygons, circles, ellipses and paths on a Canvas in a hand-drawn style.
The tool can be very handy for given an informal look to diagrams and charts in some slides or presentations. Do check their examples page, which is very impressive.
Engineer at Facebook. Previously at Spotify. Google Dev Expert in Web technologies. I like JS and performance optimization.