Should you self-host Google Fonts?

Google Fonts is great, but it also has a downside: it affects your page’s waterfall (during which some render-blocking may occur, as it involves CSS) as explained by Barry Pollard: The problem is that your website (say www.example.com) loads the stylesheet from fonts.googleapis.com, which returns some CSS made up of font-face declarations. This means you …

Watch PIP YouTube videos on macOS with pipcorn

With pipcorn you can spawn a picture-in-picture YouTube player on your Mac without installing anything! Install it globally using npm, or run it directly using npx: npx pipcorn https://www.youtube.com/watch?v=dQw4w9WgXcQ Basically it’s a wrapper around ytdl (to get the MP4 URL) and open-pip-cli (to open a PIP player). Love the name, too. pipcorn Source (GitHub) →

Wombat Dressing Room, an npm publication proxy on GCP

When automating the publishing of an NPM package, 2FA can get in the way, as you can’t really automate entering a 2FA auth code off a cellphone. Enter Wombat Dressing Room from Google: With Wombat Dressing Room, rather than an individual configuring two factor authentication in an authenticator app, 2FA is managed by a shared …

Building mobile-first web animations in React

Talk by Alex Holachek, as brought forward at React Conf 2019: As the technology to create Progressive Web Apps continues to mature, React developers have the opportunity to write web apps that in some cases can rival native ones in terms of speed and convenience. However, one barrier to feature parity is the difficulty of …

Smaller HTML Payloads with Service Workers

Philip Walton on how to progressively enhance your site by leveraging Service Workers to fetch partial HTML content and replace it in the DOM: On this site, after a user visits once and the service worker is installed, that user will never request a full HTML page again. Instead the service worker will intercept requests …

Full-stack apps with Apollo, a tutorial

The Apollo docs sports a very complete tutorial, combining TypeScript, GraphQL, and Apollo (of course): In this tutorial, we’ll build an interactive app for reserving a seat on an upcoming SpaceX launch. Think of it as an Airbnb for space travel! All of the data is real, thanks to the SpaceX-API. To populate the views, …

Alpine.js – A rugged, minimal framework for composing JavaScript behavior in your markup.

Caleb Porzio‘s “Project X” recently got its official name: Alpine.js. Alpine.js offers you the reactive and declarative nature of big frameworks like Vue or React at a much lower cost. You get to keep your DOM, and sprinkle in behavior as you see fit. It, like Vue which was one of its sources of inspirations, …

How to avoid large function signatures by using pending objects

Freek is developing Mailcoach to send out e-mail campaigns. Along with the development of the package he’s recording a video series on how he has created it. In this video he talks about using “pending objects” to make the API more readable. In this video I demonstrate how to you can create a fluent API …