|
|
▶ 21 Awesome Web Features You’re Not Using Yet? — Runs through some of the “game changing new features” that have landed on the web platform of late. It’s a good high-level run through of things delivered in a light-hearted, yet informative style. (8 minutes and a sense of humor required.) Fireship |
300ms Faster: Reducing Wikipedia's Total Blocking Time (TBT) — TBT is the sum of the blocking portion of long tasks on the main thread between First Contentful Paint (FCP) and Time to Interactive (TTI) — so lower is always better. The author got Wikipedia’s TBT down by 300ms through small, targeted optimizations like removing an unnecessary JS call and using event delegation. Nicholas Ray |
Your CI, Secured — Build your dream CI/CD workflows without sharing your secrets or source code. Buildkite sponsor |
SupportsCSS: Feature Detection for Modern CSS — Inspired by Modernizr, this little script expands on the capabilities of CSS’s Stephanie Eckles |
▶ New in Chrome 114: Adriana Jara (Google Chrome Developers) |
|
📙 Tutorials, Articles & Opinion |
Mastering CSS Blend Modes — CSS mix blend modes provide an easy, yet powerful way to create visually interesting designs, as explained here with clear cat-inspired visuals. Koding Kitty |
Announcing the Second 'Compute Pressure' Origin Trial — This new origin trial from Chrome allows web developers to monitor compute pressure (how hard the system is being worked to render the content on the current page) via the Computer Pressure API. Christiansen & Mandy (Intel) |
How to Scale a Complex React Native App? — Discover how to optimize development efficiency with super apps. Callstack sponsor |
How to Draw Any Regular Shape with Just One JavaScript Function — Mozilla/MDN has a (relatively) new blog — here they share how to use JavaScript to draw any regular shape to a HTML canvas with a single function, and how to modify it to draw multiple shapes. Ruth John |
A Brief Note on Popovers with Dialogs — When it comes to popovers and dialogs Adrian sees a potential issue for users “when developers mix and match the patterns”. Adrian Roselli |
An FYI — Eric Bailey |
Error-Message Guidelines — Sound advice for designing effective error messages that deliver high visibility, provide constructive communication, and respect user effort. Neusesser & Sunwall (NNG) |
Two Things That are Not Great About OKLCH — Color manipulation is.. tricky.
|
Creating a 'Shine Effect' on a Card with Tailwind CSS
|
Wishlist: Single Line Comments in CSS
|
|
🔧 Code, Tools & Resources |
BlockNote: A 'Notion-Like' Block-Based Text Editor — Flexible and presents an extensive API so you can integrate it with whatever you want to do. You can drag and drop blocks, add real-time collaboration, add customizable ‘slash command’ menus, and more. Builds on top of ProseMirror and TipTap. TypeCell |
Color Names: Large List of Handpicked Color Names — This goes beyond just the obvious choices like the named colors in HTML (💜 David Aerne |
React Authentication — Without Complexity — Userfront streamlines authentication & access control so engineers can focus on their core business. Read the docs now. Userfront sponsor |
Inkline 4.0: A Customizable Vue.js 3 UI/UX Library — A design system and numerous customizable components designed for mobile-first (but desktop friendly) and built with accessibility in mind. Alex Grozav |
ls-lint 2.0: A Fast File and Directory Name Linter — Written in Go but aimed at JS/front-end dev use cases, Lucas Löffel |
Bootstrap 5.3.0: The Reponsive Sass-Based Frontend Toolkit — “a monumental effort to revamp our codebase for CSS variables and color modes” – including first class support for dark mode. Mark Otto |
Scroll-Driven Animation Examples — There’s a bunch of neat demos here to show off scroll-driven animations in action that may get you thinking about how you can implement them. Bramus Van Damme |