#379 — February 20, 2019

Read on the Web

? Frontend Focus

Resource Prioritization – Getting the Browser to Help You — Use to load your key scripts at a higher priority. It’s improved Twitter Lite’s time to interactive by 36% says Addy Osmani.

Sérgio Gomes (Google)

?  How A Screen Reader User Accesses The Web — 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

Design for Developers ? New Course by Sarah Drasner — 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 — 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? — 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 — 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 — 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) — 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) — 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 — 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? — 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 — 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 — 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 — 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 — Three tips to help you understand and leverage the Grid spec.

Violet Peña

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 ??

Manifold sponsor

How to Theme with CSS Variables

Rob Wood

CSS Scroll Snap: How It Really Works

Itzik Pop

A Discussion on Rebuilding Some of MDN with React — MDN is a hugely popular and useful resource for Web developers, and they’re considering reimplementing parts of it with React.. which provoked more discussion that you might expect(!)

MDN Web Docs

? Code and Tools

Textblock: Set Continuously Responsive Typography — 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 — There’s a React component variant too.

Nathan Cahill

Lightning-Fast GraphQL Service for Ecommerce??PIM & Subscription Commerce ?

Crystallize sponsor

mailtolink.me: Mailto Link Generator — 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 — Drops support for IE 9 and 10.

Rob Larsen