Stay ahead in web development: latest news, tools, and insights #41

weeklyfoo #41 is here: your weekly digest of all webdev news you need to know! This time you'll find 42 valuable links in 5 categories! Enjoy!

🚀 Read it!

• Notes for new hires: Includes the advice to use friction and brag logs. / career / 7 min read
• How to Help Underperformers: On systemic performance, the accountability dial, feedback, and the underperformance checklist. / career / 12 min read

📰 Good to know

• How to fix slow loading apps: How often have you worked on a slow javascript web app that randomly just seemed to slow to a crawl when loading for users? / performance / 7 min read
• Get your work recognized: Write a brag document. / accomplishments / 15 min read
• Reverse Engineering TicketMaster's Rotating Barcodes (SafeTix): Experiences by using the Ticketmaster bar codes. / reverse-engineering / 17 min read
• Moving from express to fastify, pt 1: Fastify as an very good alternative to express. / express, fastify / 8 min read
• pnpm 9.5 Introduces Catalogs - Shareable Dependency Version Specifiers: pnpm 9.5 introduces a Catalogs feature, enabling shareable dependency version specifiers, reducing merge conflicts and improving support for monorepos. / pnpm / 6 min read
• What is Old is New Again: The past 18 months have seen major change reshape the tech industry. What does this mean for businesses, dev teams, and what will pragmatic software engineering approaches look like, in the future? / engineering / 22 min read
• Deactivating an API, One Step at a Time: How do you make sure all consumers stop using an API so you can safely deactivate it? / apis / 8 min read
• Don’t use booleans: Bold statement with a lot of truth in it / engineering / 4 min read
• Total TypeScript Essentials: Essentials is a book for devs of all levels to learn advanced type manipulation and real-world application development patterns in TypeScript. / typescript, learning / 14 min read
• 1 dataset 100 visualizations: Can we come up with 100 visualizations from one simple dataset? / visualizations / 3 min read
• CSS One-Liners to Improve (Almost) Every Project: A collection of simple one-line CSS solutions to add little improvements to any web page. / css / 9 min read
• Speeding up the JavaScript ecosystem - Isolated Declarations: TypeScript's new isolated declaration feature is a game changer for sharing code among developers. / typescript / 9 min read
• Mako is Now Open Source: Mako is an “extremely fast” and “production-grade” front-end build tool, based on Rust. / packaging / 8 min read
• code-pen Web Component: The best way I learn code is by trying it out for myself, which often means I'm reaching for my favourite online live code editor CodePen. Wouldn't be cool if you could wrap code blocks in a single Web Component which then allows people to open that code block in the CodePen editor? Well now you can. / code / 8 min read
• Unique New Vesting Schedules: Tech shifts away from the standard 4-year evenly spread vesting schedule / vesting / 4 min read
• How we use friction logs to improve products at Stripe: Friction logging is a practice that can be used by engineering teams building products to track and improve upon issues that users experience while using a product. / improvements / 13 min read

🧰 Tools

• threedsvg: Instantly Convert Any SVG to a 3D Logo / svg
• QuickJS: A typescript package to execute javascript code in a webassembly quickjs sandbox / sandbox
• BeaconDB: public domain wireless geolocation database / geo
• Handy Arrows: A customizable gallery of hand-drawn arrow SVGs that can be easily copied as SVG code or React components for use in your projects. / svgs
• Explainer for the Prompt API: A proposal for a web API for prompting browser-provided language models / ai
• Onlook: The open source, local-first Webflow alternative. Design directly in your live React site and publish your changes to code. / pages
• SQL Studio: SQL Database Explorer [SQLite, libSQL, PostgreSQL, MySQL/MariaDB, DuckDB, ClickHouse] / databases
• Incidental: An opensource incident management platform integrating with Slack. / incidents
• Public APIs: A collective list of free APIs / apis
• milliparsec: Tiniest body parser in the universe. Built for modern Node.js / parser
• Parallel DOM: Multithreaded DOM is possible. / dom
• tegon: Tegon is an open-source, AI-first alternative to Jira, Linear / projects
• Discover the base building blocks of any website: Get the colors, icons, and fonts from any website in seconds. Great for sparking new design ideas! / design
• Braille-Tools: CSS and Javascript to display Braille grade 1 in web pages (for sighted people). / braille
• Tailkits: Premium & free Tailwind CSS templates, UI Kits, and components to build modern websites faster. / tailwind
• dotUI: Accessible, mobile friendly, modern UI components. / ui
• CodeMirror: Development repository for the CodeMirror editor project / editors
• Posting: The modern API client that lives in your terminal. / http

🎨 Design

• The Only 8 Fonts You Will Ever Need: The first three fonts are new to me, but the other ones are classic. / fonts / 7 min read
• Dark Patterns Hall of Shame: Protect your online privacy and rights by learning about dark patterns and unethical designs. Stay informed and avoid manipulation in the digital world. / dar-patterns / 6 min read
• The Magic of Clip Path: clip-path is often used for trimming a DOM node into specific shapes, like triangles. But what if I told you that it's also great for animations? / css / 16 min read

📺 Videos

• HTMX - Why You Don't Always Need a SPA Framework: NDC Sydney 2024 / htmx
• The software engineering industry in 2024 - what changed in 2 years, why, and what is next: Keynote at Craft Conference 2024 / engineering
• Advanced HTML for Good Developers: NDC Sydney 2024 / html

Want to read more? Check out the full article here.

To sign up for the weekly newsletter, visit weeklyfoo.com.