Unlocking the Puzzle: Investigating Multiple Event Listeners in Vue.js

In this article, we will tackle a question: Does Vue.js support multiple event listeners? Our journey will take us deep into the mechanics of Vue.js, unraveling some intriguing undocumented behaviors along the way. - https://dev.to/charnog/unlocking-the-puzzle-investigating-multiple-event-listeners-in-vuejs-3cl2

#vue

The Complete Puppeteer Cheatsheet

If you want to control a headless Chrome browser from Node, Puppeteer is for you. Now we just need a Playwright one as well - https://proxiesapi.com/articles/the-complete-puppeteer-cheatsheet

#nodejs #e2e

How Bear Does Analytics With CSS

Herman Martinus explains how he uses CSS to trigger a URL analytics endpoint on body:hover to create a unique “read” of a page. - https://herman.bearblog.dev/how-bear-does-analytics-with-css

#css

A Recap of the Electron Ecosystem in 2023

The Electron project takes December off so now's a good time to look at recent developments. Electron 28 is the final release of the year and uses Chromium 120, Node 18.18.2, and V8 12.0, plus ES module support has been enabled. - https://www.electronjs.org/blog/ecosystem-2023-eoy-recap

#nodejs

Moving Back to React

Preact felt like a logical, lightweight choice to this team at one time, but they’ve switched to React for better compatibility with Next.js, among other things. Their page weight is up slightly, but they feel the tradeoff is worth it. - https://daily.dev/blog/moving-back-to-react

#react

Happy New Year!!!

The Anatomy of a Vue 3 Component

Vue 3 has made significant progress and reached a strong level of maturity with Composition API & Script Setup. In this article explore all the ingredients of a Vue 3 component using Composition API and Script Setup. - https://fadamakis.com/the-anatomy-of-a-vue-3-component-285eadadea89

#vue

Creating Accessible UI Animations

Oriana García explains how her team tackled the challenge of balancing animation and accessibility by creating guiding principles for applying animation to user interfaces and incorporating them into the team’s design system. - https://www.smashingmagazine.com/2023/11/creating-accessible-ui-animations

#css

Build an Infinite Scroll Component in Angular - https://netbasal.com/build-an-infinite-scroll-component-in-angular-a9c16907a94d

#angular

Simplifying Server Components

In a talk given at the recent React Advanced conference, Mark boiled down one of the newest, and perhaps most controversial, React features. A good, straightforward explanation of the parts involved and how they fit together. - https://portal.gitnation.org/contents/simplifying-server-components

#react

Advanced Patterns for Taking Page Element Screenshots with Playwright

Let’s say you take screenshots of pages using Playwright but want to do things like mask certain bits of content, modify the image in other ways, or even manipulate the DOM before taking the screenshot? Liran shares some code snippets for you. - https://lirantal.com/blog/advanced-usage-patterns-for-taking-page-element-screenshots-with-playwright/

#nodejs

Getting Started with Web Performance

Alistair Shepherd goes through some of the reasoning, jargon, metrics, tools, and top tips on improving your web performance. - https://www.htmhell.dev/adventcalendar/2023/14

#web #performance

View Transitions

Chen Hui Jing demonstrates how animating DOM state changes no longer requires a mountain of code thanks to the new View Transitions API. - https://12daysofweb.dev/2023/view-transitions

#css

Managing SVG Icons Effectively: Using vite-svg-loader in Vue & Vite Projects

SVGs have become key to creating high-quality images in modern web development as well as providing a great user experience by adapting to screen sizes. In this article we will learn how to manage svgs in Vue & Vite projects. - https://medium.com/@muhammederdinc/managing-svg-icons-effectively-using-vite-svg-loader-in-vue-vite-projects-990d2dc7ee02

#vue

Next.js 14: You Missed The Best Part

Can we turn React components into self-contained Lego blocks that talk to backend services? Let’s find out! - https://www.youtube.com/watch?v=xoVpFAXBats

#react

Node.js Configurations Masterclass

Well-known Node developer and TSC member Matteo looks at the phenomenon of so much Node code depending on the value of environment variables (and NODE_ENV, in particular, which affects the behavior of many modules) and the role that secret management can play in building robust, secure apps. - https://www.youtube.com/watch?v=kVnh_tNYqxk

#nodejs

How to use Angular Signals

Simplify Angular development with reactive properties - https://betterprogramming.pub/how-to-use-angular-signals-619dcbb40e5a

#angular

How to use Chrome’s accessibility tree

Whitney Lewis shares how Chrome’s accessibility tree can help you debug issues and quickly check custom widgets for accessibility. - https://blog.pope.tech/2023/11/27/how-to-use-chromes-accessibility-tree

#devtools

Vue.js Memory Leak Identification And Solution

There is no doubt that Vue.js is a popular and powerful JavaScript framework that allows us to build dynamic and interactive web applications. However, like any software, Vue.js applications can sometimes experience memory leaks that can lead to performance degradation and unexpected behavior. This article will dive into the causes of memory leaks in Vue.js applications and explore effective strategies to identify and fix them. - https://blog.jobins.jp/vuejs-memory-leak-identification-and-solution

#vue

New CSS Viewport Units Do Not Solve The Classic Scrollbar Problem

Šime Vidas explains why 100vw does not always represent the full width of the viewport and shows how to avoid it, along with approaches we may have to solve it in the future. - https://www.smashingmagazine.com/2023/12/new-css-viewport-units-not-solve-classic-scrollbar-problem

#css