Listen to episode
This week I wanted to have big shout out to the Macaw team who are sponsoring the newsletter for the week. Macaw is a new browser based tool that will allow you to ditch your favourite image editing tool you use to create mockups and instead allow you to create the as real HTML and CSS.
If you use the promotional code RWD it’s good for $30 with offers valid until 30th April 2014.
In last weeks podcast I featured a screenshot from the SpeedCurve interface showing the usage of images and fonts on the Smashing Magazine website. As a result of that I updated my bench mark site from A List Apart to Brad Frost Web.
In the next few days I received an email telling me how much slower I was than Brad’s site which I tweeted about (see below). This sparked a bit of a conversation about what tool was being used and what exactly was being measured (as well as whether it was fair to compare Smashing with this site and Brads… it’s not really).
— justin avery (@justinavery) April 2, 2014
At the end of the conversation we agreed that it were better to base the performance off the perception of when the page was ready to be used. As you can see from the animated gif below, speedcurve will highlight the different load times between
- Backend (or time to first byte)
- Start Render (when the first HTML begins to render)
- DOM load (when the page DOM is ready)
- Fully Loaded (Advertisements and all… which is why Smashing struggle)