End-to-end Tests that Don’t Suck with Puppeteer

Good introduction to using Puppeteer for your e2e tests: One of the most popular tools for e2e testing is Selenium, which is a tool for automating web browsers. Selenium sounds cool in theory: write one set of tests that run on all browsers and devices, woohoo! Jk. In practice, Selenium tests are slow, brittle, and …

“A-Frame Tutorials” Video Series

Alexandra Etienne has published a 7-part video series on working with A-Frame on YouTube: A-Frame is a framework for building rich 3D experiences on the web. It’s built on top of three.js, an advanced 3D JavaScript library that makes working with WebGL extremely fun. The cool part is that A-Frame lets you build WebVR apps …

ESNext: Dynamically import ES modules with “dynamic import()

UPDATE June 2019: This feature has now advanced to Stage-4 and will be part of the ES2020 Specification! 🎉 One of the recent ECMAScript proposals that landed in Chrome 63 is dynamic import(): Dynamic import() introduces a new function-like form of import, which allows one to import on demand. It returns a promise for the …

TIP: Enable Two Factor Authentication (2FA) with your NPM account

Since early October it’s possible to enable Two Factor Authentication with your NPM account. 2FA is another layer of defense for your account, preventing third parties from altering your code even if they steal or guess your credentials. This is one of the easiest and most important ways to ensure that only you can access …

Strava Global Heatmap

Strava has released a Global Heatmap powered by Mapbox GL, plotting all locations where their users go run / go cycle / do water activities / do winter activities. The raw input activity streams data comes from a Spark/S3/Parquet data warehouse. This data includes every one of the 3 trillion GPS points ever uploaded to …

SQIP – SVG-Based Image Placeholder

In an in-depth analysis on how Medium loads up their images, José M. Pérez explains how their “blur-up technique” works: Display a resized version of the original at the original size, with a blur filter on top to hide the artifacts. Load in the bigger one. Once the big version is loaded, replace the small …

JSON5 – JSON for Humans

JSON isn’t the friendliest to write. Keys need to be quoted, objects and arrays can’t have trailing commas, and comments aren’t allowed — even though none of these are the case with regular JavaScript today. JSON5 is a proposed extension to JSON that allows these kinds of things. Here’s an example showcasing most of its …

Accessing a tweet using only its ID (and without the Twitter API)

See the Pen Twitter Tweet URL Generator by Bramus (@bramus) on CodePen. Today I learned that Twitter totally ignores the username in the “tweet detail route” on their website. This allows you to view details of a (public) tweet when knowing only its ID, without needing to access the Twitter API (which is the default …

PHP Session Locking: How to Prevent Blocking Requests

Today I learned about “PHP Session Locking”: PHP writes its session data to a file by default. When a request is made to a PHP script that starts the session (session_start()), this session file is locked. What this means is that if your web page makes numerous requests to PHP scripts, for instance, for loading …