Issue #11 — The Critical Request, Facebook news feed changes and more!
If you’ve ever thought "How does the browser decide which resources to download… and in which order?" wonder no more. This article explains in great detail how Chrome’s network priority system works and demystifies how to use to great advantage.
By understanding Critical requests and how to prioritise them, I estimate that you could easily speed up to 69% of sites on the web by 3–5 seconds.
Don't miss this.
| [Read Article](https://css-tricks.com/the-critical-request/) |
Chrome 60 has arrived, with it [Google's Lighthouse](https://developers.google.com/web/tools/lighthouse/) tool. Lighthouse tests pages with over 50 performance, PWA, accessibility and best practice audits.
It's right there built into devtools: Make sure you have at least Chrome 60, and open devtools—you'll find it under "Audits".
[Calibre](https://calibreapp.com?utm_source=perfemail&utm_content=11&utm_medium=email) also has Lighthouse built in. Our recommendation: Use Lighthouse/Chrome in development, and Calibre/Lighthouse in production. 📉
| [Get started with Lighthouse](https://developers.google.com/web/tools/lighthouse/) |
The Import Cost extension for Visual Studio Code (Created by the [Wix team](https://twitter.com/wixeng)) shows the size of the JavaScript module that is being required / imported.
It'll colour-code the size output based on a how large a dependency is. Seems like a great way to quietly keep on top of your bundle size without running complex post-build tools and analysis. Dig it. 👏
| [Install Import Cost](https://marketplace.visualstudio.com/items?itemName=wix.vscode-import-cost) |
[Susie Lu](https://twitter.com/DataToViz) and [Sam Saccone](https://twitter.com/samccone) have teamed up to create 'Bundle Buddy', a tool that analyses source maps to decipher when your bundles contain repeated code.
Bundle buddy is installed as a command line tool. Once run it'll self-host an app that lets you explore your bundles in depth. Sweet.
| [Bundle buddy on GitHub](https://github.com/samccone/bundle-buddy) |
This week Facebook said that in the coming months your feed will contain more content that loads quickly on a mobile and less that does not.
Google has been known to prioritise pages with a good Pagespeed ranking higher into search results since as early as 2010.
Your bet is as good as mine, but with Google pushing AMP pages, and [Facebook's Instant Articles](https://instantarticles.fb.com) project, we're bound to see vastly different looking news feeds and search pages in the coming year. 🤔
| [Fast feed](https://newsroom.fb.com/news/2017/08/news-feed-fyi-showing-you-stories-that-link-to-faster-loading-webpages/) |
A couple of features you might expect are disabled, so be sure to read the docs a bit to get the full scoop. 👍
| [Googlebot renderer](https://developers.google.com/search/docs/guides/rendering) |
Creating a dashboard is a great way to share insightful information with your whole organisation. Up until now, Calibre's customers have been creating their dashboard integrations using Calibre’s Snapshot webhooks.
We wanted to make it easier to get started here, which is why we've built and open sourced [Calibre-Geckoboard](https://github.com/calibreapp/geckoboard).
| [Create your own performance metrics dashboard 📈](https://building.calibreapp.com/geckoboard-integration-create-your-own-performance-metrics-dashboard-dedbbe03a136) |
BROUGHT TO YOU BY
** ♠︎ Calibre** — Let’s make the web fast for everyone.
