Tessera
Folgen

JavaScript Daily

@javascriptdaily.bsky.social

Sharing links, news, and humor about JS, TypeScript, and related front-end technologies with trademarked names 💛

39 Posts1353 Follower4 Folgt
JavaScript Daily@javascriptdaily.bsky.social · 5mo ago

Building a Scroll-Reactive 3D Gallery with Three.js, Velocity, and Mood-Based Backgrounds: https://tympanus.net/codrops/2026/03/09/building-a-scroll-reactive-3d-gallery-with-three-js-velocity-and-mood-based-backgrounds/

Building a Scroll-Reactive 3D Gallery with Three.js, Velocity, and Mood-Based Backgrounds | Codrops

A tutorial on building a scroll-driven WebGL gallery in Three.js with depth-layered images, palette-driven backgrounds, and motion that responds to scroll velocity.

tympanus.net

JavaScript Daily@javascriptdaily.bsky.social · 5mo ago

This new, experimental, ‘Network Efficiency Guardrails’ feature is available in Edge 146: https://blogs.windows.com/msedgedev/2026/03/17/monitor-and-improve-your-web-apps-load-performance/

Monitor and improve your web app’s load performance

Today, large web applications are often assembled from many independent pieces, which all load their own data and resources. When all these pieces compete for the same network connection, congestion can build up and the user experience can suffer.

blogs.windows.com

JavaScript Daily@javascriptdaily.bsky.social · 6mo ago

Learn Visual Studio Code: https://lazarpress.gumroad.com/l/learnvscode

Learn Visual Studio Code

A collection of 150+ tips and customizations on using Visual Studio Code, the world's most popular code editor. These tips are almost entirely based on built-in features of VS Code – no extensions or external tools needed. You'll learn how to customize VS Code's UI, find and change settings you didn't know existed, use little-known features, and lots more.Includes more than 150 tips across 346 pages (PDF version; EPUB is more variable in page length) with 450+ full-color, high-resolution screenshots and captions with clear instructions on every feature discussed. Nearly all features and screenshots are up to date with the latest version of VS Code as of January 2026.There are tips in here for beginners, but most of the tips are little-known features that even advanced users don't know about. It doesn't matter if you're a Mac or Windows user, almost all the content is applicable to both operating systems. Much of the code examples are focused on front-end technologies (JS, HTML, CSS, TypeScript, etc.) but the concepts are applicable to any language used inside VS Code.Lots of unique content is covered, including: Using the Settings UI Little-known Terminal Tips The Code Snippets feature Editing Keyboard Shortcuts Using Zen Mode VS Code Workspaces Working with Profiles Extension Trust & Security Managing Tabs & Windows Customizing Labels & Buttons Using IntelliSense Accessibility Tips ... and lots more! Some of the content includes links to animated GIFs so you can see the tip or customization in action. The GIFs aren't necessary to understand the content, but they are helpful if you're reading online. Check out a couple of sample pages below!

lazarpress.gumroad.com

JavaScript Daily@javascriptdaily.bsky.social · last yr.

A Better API for the Intersection and Mutation Observers: https://css-tricks.com/a-better-api-for-the-intersection-and-mutation-observers/ (Zell refactors both the Mutation and Intersection Observers into something "way simpler to use".)

A Better API for the Intersection and Mutation Observers | CSS-Tricks

Zell discusses refactoring the Resize, Mutation, and Intersection Observer APIs for easier usage, demonstrating how to implement callback and event listener patterns, while highlighting available options and methods.

css-tricks.com

JavaScript Daily@javascriptdaily.bsky.social · last yr.

Lessons Learned From My First Dive Into WebAssembly: https://nullprogram.com/blog/2025/04/04/

Lessons learned from my first dive into WebAssembly

It began as a water sort puzzle solver, constructed similarly to my British Square solver. It was nearly playable, so I added a user interface with SDL2. My wife enjoyed it on her desktop, but wished to play on her phone. So then I needed to either rewrite it in JavaScript and hope the solver was still fast enough for real-time use, or figure out WebAssembly (WASM). I succeeded, and now my game runs in browsers (source). Like before, next I ported my pkg-config clone to the WASM System Interface (WASI), whipped up a proof-of-concept UI, and it too runs in browsers. Neither use a language runtime, resulting in little 8kB and 28kB WASM binaries respectively. In this article I share my experiences and techniques.

nullprogram.com

JavaScript Daily@javascriptdaily.bsky.social · last yr.

Lazy Load Background Images with the IntersectionObserver API: https://www.debugbear.com/blog/lazy-load-background-images-intersection-observer

Lazy Load Background Images with the IntersectionObserver API | DebugBear

The IntersectionObserver API is a performance-friendly browser API that allows you to lazy load background images asynchronously, outside of the main thread. This tutorial looks into how to implement it using HTML, CSS, and JavaScript.

debugbear.com

JavaScript Daily@javascriptdaily.bsky.social · last yr.

Web Components Vs. Framework Components: What’s The Difference? https://www.smashingmagazine.com/2025/03/web-components-vs-framework-components/

Web Components Vs. Framework Components: What’s The Difference? — Smashing Magazine

Some critics question the agnostic nature of Web Components, with some even arguing that they are not real components. Gabriel Shoyomboa explores this topic in-depth, comparing Web Components and framework components, highlighting their strengths and trade-offs, and evaluating their performance.

smashingmagazine.com

JavaScript Daily@javascriptdaily.bsky.social · 2y ago

Kinesis.js: A Library to Easily Create Complex Interactive Animations - https://github.com/amineyarman/Kinesis.js

GitHub - amineyarman/Kinesis.js: A library that offers a suite of components to create engaging animations and transformations based on user interactions like mouse movements, scroll events, and even audio input.

A library that offers a suite of components to create engaging animations and transformations based on user interactions like mouse movements, scroll events, and even audio input. - GitHub - amineyarman/Kinesis.js: A library that offers a suite of components to create engaging animations and transformations based on user interactions like mouse movements, scroll events, and even audio input.

github.com