A rather geeky/technical weblog, est. 2001, by Bramus
Similar to how jq allows you to extract content from JSON files on the CLI, htmlq allows you extract content from HTML files. Like jq, but for HTML. Uses CSS selectors to extract bits of content from HTML files. You can pass in a local HTML file, but also pipe it to cURL requests. For …
Interesting video from the CodePen podcast in which Shaw goes over this approach to SSR with Next and Apollo: A probably-better approach is to use the getDataFromTree method, which walks down the tree and executes the queries to fill up the ApolloClient cache. Create a shared ApolloClient instance Render the page using getDataFromTree() to fill …
Continue reading “Next.js + Apollo + Server Side Rendering (SSR)”
If you have multiple accounts to use with Git — such as a personal and a work account — you can have your Git Config (typically ~/.gitconfig) conditionally include other configs depending on the folder you’re working in. In those extra configs you then can override some settings. Here’s an example ~/.gitconfig that has two …
Great post by George Francis, in which he leverages the Voronoi tessellation to generate aesthetically pleasing random patterns. When composing generative patterns, placing objects on a canvas purely at random can feel chaotic, while aligning them to a traditional grid can feel rigid/predictable. While both chaos and exacting precision can both be beautiful qualities in …
Continue reading “Crafting Organic Patterns With Voronoi Tessellations”
Mid-August the WICG published a (unofficial) specification for a Native Eye Dropper — a tool you can use to get the color from the pixel that’s underneath the cursor — on the web. Let’s take a look … Usage The proposal is pretty straightforward: This API enables authors to use a browser supplied eyedropper in …
Continue reading “Pick Colors from websites your entire screen with the JavaScript EyeDropper API”
I like this video from Vertiasium on Cosmic Rays and how they can trigger bit flipping in our computers, known as “Single Event Upsets”. Tiny particles from distant galaxies have caused plane accidents, election interference and game glitches. Solid buildup, good pacing, and well explained.
I have no idea how this works, but it’s amazing: See the Pen Morse Code Translator (HTML & CSS) by Lillian Kodi (@lillian-kodi)on CodePen. By Lillian Kodi who created this amazing HTML+CSS Calculator before. As only Chromium supports animating custom properties (Houdini FTW!) it won’t work in Safari nor Firefox. For reference, you can see …
Starting off with a 10.06MB SVG, Zach Leatherman tried several routes to reduce the weight of the hero image on the right side of the home page on JamStackConf.com. Eventually he settled on an approach where he layered a transparent WebP image on top of an SVG. Both layers were optimized individually, leaving only 78KB …
Digging deeper into Chromium’s RenderingNG architecture, this post explains its key data structures: Frame trees, The immutable fragment tree, Property trees, Display lists and paint chunks, and Compositor frames. Let’s dig into the key data structures that are inputs and outputs to the rendering pipeline. Would love to see this as a talk at a …
Continue reading “Key data structures and their roles in RenderingNG”