---
title: "Speeding up Web experiences with prioritization and preloading"
publication: "Frontend Focus"
issue: 379
published_at: "2019-02-20"
canonical_url: "https://frontendfoc.us/issues/379"
---
This week's HTML, CSS, browser, and frontend news
#379 — February 20, 2019
[Read on the Web](https://frontendfoc.us/issues/379)
🚀 Frontend Focus
[](https://developers.google.com/web/fundamentals/performance/resource-prioritization)
[Resource Prioritization – Getting the Browser to Help You](https://developers.google.com/web/fundamentals/performance/resource-prioritization) — Use `` to load your key scripts at a higher priority. It’s improved Twitter Lite’s time to interactive by 36% [says Addy Osmani.](https://twitter.com/addyosmani/status/1095948254515159040)
Sérgio Gomes (Google)
▶[How A Screen Reader User Accesses The Web](https://www.smashingmagazine.com/2019/02/accessibility-webinar/) — Léonie Watson (a blind screen reader user and web accessibility expert) explores the web, explaining some unexpected properties of HTML elements that have a huge impact on accessibility and performance.
Bruce Lawson [](https://frontendmasters.com/courses/design-for-developers/)
[Design for Developers ✨ New Course by Sarah Drasner](https://frontendmasters.com/courses/design-for-developers/) — Become more self-sufficient for the entire process for execution, from concept to design to implementation. Understand the rules for designing and learn to create complex and beautiful front-end experiences.
Frontend Masters sponsor
[Preloading Fonts and the Puzzle of Priorities](https://andydavies.me/blog/2019/02/12/preloading-fonts-and-the-puzzle-of-priorities/) — Another on preloading. This one's a thorough and detailed look at how `` behaves specifically in regards to _fonts_, concluding that there’s a case to be made for preloading one or maybe two critical fonts.
Andy Davies
['Trusted Types' To Help Prevent Cross-Site Scripting?](https://developers.google.com/web/updates/2019/02/trusted-types) — A look at an experimental, Chrome-only API that aims to prevent DOM-based cross-site scripting by only letting special typed objects to make certain types of changes to the page. If this approach were to catch on in a standardized, cross-browser way it could be a big deal.
Krzysztof Kotowicz (Google)
[Google Wants to Make It Harder for Sites to Detect That You’re Using Chrome’s Incognito Mode](https://9to5google.com/2019/02/15/google-chrome-detect-incognito/) — The FileSystem API is being used to determine whether or not a user is in Incognito mode. Google is looking to stop this and eventually deprecate and remove the API.
Kyle Bradshaw
[Trust is Good, Observation is Better: Intersection Observer v2](https://developers.google.com/web/updates/2019/02/intersectionobserver-v2) — Intersection Observer v2 adds the capability to not only observe intersections themselves, but to also detect if the intersecting element was _visible_ at the time of intersection.
Thomas Steiner (Google Developers)
💻 Jobs
[Full-Stack Developer, Permanent (London, UK)](https://birch.wiki/devjob) — We’re looking for a new member of the team to work closely alongside our Senior Developer & Designers.
Birch Creative Limited
[Sr Front End Software Engineer (Americas)](https://host-compliance-llc.breezy.hr/p/aaf8bf0b7bf4-sr-front-end-software-engineer-americas) — Are you a top-notch Frontend engineer with a focus on building powerful, responsive, and maintainable web applications?
Host Compliance
[Find A Job Through Vettery](https://www.vettery.com/tech?utm_source=newsletter&utm_medium=cooper-frontendfocus&utm_term=tech&utm_content=grouped&utm_campaign=ad-77580) — Vettery specializes in developer roles and is completely free for job seekers.
Vettery
📘 Tutorials & Opinion
▶[Will Saving Images in 72 Dpi Save Your Website Bandwidth?](https://www.youtube.com/watch?v=9mSCC27PaCk) — Discusses the misunderstood notion that images must be saved in 72 DP in order to optimize images for the web.
The Web Demystified
[Managing Image Breakpoints with Angular](https://www.smashingmagazine.com/2019/02/image-breakpoints-angular/) — Angular has a built-in feature called BreakPoint Observer that evaluates media queries and reacts to the changing environment.
Tamas Piros
[Struggling with MongoDB? Release the Full Power with Studio 3T](https://studio3t.com/try/?utm_source=newsletter&utm_medium=cooper&utm_campaign=Feb20) — Get started with the IDE that saves you time and makes it easy. MongoDB for all, from startup to enterprise.
Studio 3T sponsor
[How `@supports` Works](https://css-tricks.com/how-supports-works/) — The `@supports` query tests if a browser can support a particular property before applying a block of style.
Chris Coyier
[Using CSS Grid The Right Way](https://vgpena.github.io/using-css-grid-the-right-way/) — Three tips to help you understand and leverage the Grid spec.
Violet Peña
[IE10-Compatible Grid Auto-Placement with Flexbox](https://css-tricks.com/ie10-compatible-grid-auto-placement-with-flexbox/) — If you need to support older browsers here’s one approach to achieving grid-like layouts.
Brian Holt
[Shop Like a Developer – Discover and Experiment with Hot New Cloud Services 🔥🔭](https://www.manifold.co/features?utm_campaign=FrontEndFocus&utm_source=newsletter&utm_medium=sponsorship&utm_content=Feb20)
Manifold sponsor
[How to Theme with CSS Variables](https://www.browserlondon.com/blog/2019/01/15/css-variables-theming/)
Rob Wood
[CSS Scroll Snap: How It Really Works](https://blog.usejournal.com/css-scroll-snap-how-it-really-works-94d99db80bc9)
Itzik Pop
[A Discussion on Rebuilding Some of MDN with React](https://github.com/mdn/sprints/issues/967) — [MDN](https://mdn.dev/) is a hugely popular and useful resource for Web developers, and they’re considering reimplementing parts of it with React.. which provoked more discussion than you might expect(!)
MDN Web Docs
🔧 Code and Tools
[Textblock: Set Continuously Responsive Typography](https://textblock.io/) — A JavaScript tool for adjusting size, leading, and grades to cast 'continuously responsive typography.' It works over your current CSS as a progressive enhancement.
Glyphic
[Split.js: Create Resizable Split Views / Panes / Frames](https://split.js.org/) — There’s a [React component variant](https://github.com/nathancahill/split/tree/master/packages/react-split) too.
Nathan Cahill
[Lightning-Fast GraphQL Service for Ecommerce✌️PIM & Subscription Commerce 🎉](https://crystallize.com/)
Crystallize sponsor
[mailtolink.me: Mailto Link Generator](https://mailtolink.me/) — A simple markup generator for `mailto` links (direct links to email clients from the Web) that takes care of the formatting for you. Note that the address is not obfuscated, however.
Michael Mckeever
[html5-boilerplate v7 Released](https://github.com/h5bp/html5-boilerplate/releases/tag/v7.0.0) — Drops support for IE 9 and 10.
Rob Larsen
🗓 Upcoming Events
[An Event Apart, March 4-6 — Seattle, Washington](https://aneventapart.com/event/seattle-2019) — A 3-day conference with 17 sessions and a focus on digital design, UX, content, code, and more.
[UpFront Conference, March 22 — Manchester, UK](https://upfrontconf.com/) — A frontend conference 'open to everyone who makes for the web'.
[SmashingConf, April 16–17 — San Francisco, California](https://smashingconf.com/sf-2019/) — A friendly, inclusive event which is focused on real-world problems and solutions
[CSSCamp 2019, July 17 — Barcelona, Catalunya](https://csscamp.tech/) — A one-day, one-track conference for web designers and developers.
A **[Cooperpress](https://cooperpress.com/)** publication — Curated by [Chris Brandrick](https://twitter.com/chrisbrandrick) and [Peter Cooper](https://twitter.com/peterc).
[Change your email address](https://frontendfoc.us/edit_subscription/*|UID|*) or[stop getting this newsletter](https://frontendfoc.us/leave/*|UID|*)
© Cooper Press Ltd · Fairfield Enterprise Centre, Louth, LN11 0LS, United Kingdom