Collective #543

Faster Image Loading With Embedded Image Previews
Christoph Erdmann writes about the Embedded Image Preview (EIP) technique that allows us to load preview images during lazy loading.
Read it
Analyze, diagnose & fix errors in record time
Never wonder how to repro a bug again. Dedupe bug reports easily. Gain visibility into errors that help your team prioritize errors.
Try it for free
Postwoman
Postwoman is a minimal API request builder made by Liyas Thomas.
Check it out
Chart.xkcd
Chart.xkcd is a chart library for plotting hand-drawn styled charts.
Check it out
JavaScript to Know for React
An article on what JavaScript features you should be familiar with when learning and using React. By Kent C. Dodds.
Read it
Pagemap
A really nice tool to create a mini map for your web page.
Check it out
React Layouts
Grab-and-go layouts for React including code examples for Rebass, Theme UI, or Emotion. By Brent Jackson.
Check it out
Ruffle
Ruffle is an Adobe Flash Player emulator written in the Rust programming language. Ruffle targets both the desktop and the web using WebAssembly.
Check it out
WIDE AWAKE
A fantastic psychadelic scroll journey made with Cables.
Check it out
Radial Menu
A highly customizable radial menu that's very easy to setup.
Check it out
JavaScript: The Modern Parts
An article by Andrew Montalenti on the exciting evolution of JavaScript.
Read it
Friend NDA Generator
FrieNDA is a NDA generator for you and your friend's secret (for fun).
Check it out
Consume less, create more
A great read on how modern technology makes us consumers instead of creators.
Read it
Animated Portrait w/ GSAP 2.0
A lovely portrait demo with a switch animation made by Darin Senneff.
Check it out
How to build a plugin system on the web and also sleep well at night
Rudi Chen on a big challenge for Figma: designing a robust plugin system.
Read it
Mario HTML
A TypeScript version of the iconic game. Made by Neil Barkhina.
Check it out
Jeremy Keith - Building The Web - View Source 2019
An interview with Jeremy Keith on the state of the web, how we evolved over all these years, the tooling and the skills necessary to know for front-end engineers today.
Watch it
How DNS works
A fun and colorful explanation of how DNS works.
Check it out
Animated Verbs
Ryan Mulligan created some fun letter animations.
Check it out
100 Dots #2 : Tornado
Adam Kuhn created this fun demo of a tornado.
Check it out
Svelte tutorial
A tutorial that will teach you everything you need to know to build fast, small web applications easily with Svelte.
Check it out
Introducing nushell
The introduction of a new shell, written in Rust that draws inspiration from the classic Unix philosophy of pipelines and the structured data approach of PowerShell.
Read it
React Slider with Parallax Hover Effects
Walk through the build of a React slider and learn how to implement a parallax hover effect.
Read it