Collective #722
Publikováno: 28.7.2022
The Study of Shaders with React Three Fiber * DOM ready events considered harmful * PrimeReact
Inspirational Website of the Week: Camille Mormal
A super-sharp design with slick animations and lovely details. Our pick this week.
Our Sponsor
Fully Managed Cloud & Web Hosting
Codrops’ host of choice since 2016 is Liquid Web because they provide an unrivaled hosting experience, delivering 99.999% uptime and 24/7 heroic human support.
DOM ready events considered harmful
Jake and Cassie talk about DOM ready events, which can slow down your app in unexpected ways. But what are the alternatives? Learn more about it in this episode of HTTP 203.
The Study of Shaders with React Three Fiber
A complete guide on how to use shaders with React Three Fiber, work with uniforms and varyings, and build dynamic, interactive and composable materials with them through 8 unique 3D scenes. By Maxime Heckel.
WebGi Camera Landing Page
A template for buildind scrollable landing pages with GSAP, ScrollTrigger and WebGi engine in TypeScript using the Parcel bundler. By Anderson Mancini.
Tech ethics: If cookie consent prompts were honest…
This case study shows how a cookie consent prompt went over the ethical line.
I Regret My $46k Website Redesign
Some interesting insights on the msitakes made during a redesign project by
PrimeReact
A large collection of design-agnostic, flexible and accessible React UI Components.
Font Subsetting Strategies: Content-Based vs Alphabetical – Cloud Four
Paul Hebert explains the two main subsetting strategies that have different advantages depending on the type of site you’re building.
Solving “The Dangler” Conundrum with Container Queries and :has()
Dave Rupert explains how to solve the “Dangler” problem using :has() and Container Queries.
Help pick a syntax for CSS nesting
Two competing syntaxes need your help in determining which should be championed through to a specification candidate. By Adam Argyle and Miriam Suzanne.
Hello: Search Engine for Developers (Beta)
A new search engine made for developers.
GMTK Game Jam 2022: Dice Out
Nikita Prokopov writes about how he made a game for the GMTK Game Jam 2022.
Can SVG Symbols affect web performance?
When it comes to repeatable SVGs, most people would create a component and reuse it anywhere they want. There’s a high chance, that you would be missing some performance freebies. If you’re striving for that bang-for-the-buck kind of performance, this article might be interesting for you.
UpToDate what?
UpToDate tracks versions of popular projects so that you can check easily what the latest stable release is.
Coding an extension that blocks Social Media Websites with HTML, CSS and JS
In this article, Helitha Rupasinghe shows you how you can create a Google Chrome extension that will block social media sites for better productivity.
Cascading CSS Text Effects
Cool animations for texts on scroll made by Jhey.
Pure CSS Cartoon or Not?
Amazing CSS art made by Julia Miocene.
A good reset
A response to Jeremy’s post on “Control”, and why developers opt for divs, not buttons. By Trys Mudford.
A guide to search inputs
Sarah Edwards outlines some key principles to help you create a fit-for-purpose search input.
UI Buttons
Collection of hand-picked free HTML and CSS button code examples. Updated as of July 2022. 100 new items.
Maintenance Matters
Annie Kiley shares a list of ten simple things the team at Viget does to make their projects as maintainable as possible, regardless of the stack.
Your Code Doesn’t Have to Be a Mess
Daniel Sieger outlines a few high-level strategies to keep software simple.
TypeScript Tutorial: A Guide to Using the Programming Language
Learn how to build a simple TypeScript Hello World app in this tutorial by Jack Wallen.