How 1Password Used esbuild to Cut Browser Extension Build Times

1Password is a popular password management tool that relies upon a browser extension to fill out passwords on the Web. At over a minute for a single build, things were starting to drag for the devs. Could esbuild help? A fun story with plenty of technical details. - https://blog.1password.com/new-extension-build-system/

#esbuild

Mastering Node.js Performance Hooks

Node’s performance measurement APIs provide a lot of power, but it can be tricky to get your head around the mental model of what they measure and where they make sense. Pavel tries to clear it all up for us. - https://pavel-romanov.com/nodejs-performance-hooks-mastering-the-mental-model

#nodejs

CSS Grid Gap Behavior with Hidden Elements

Ryan Mulligan shares some discoveries on how the CSS gap property operates when hiding items in grid-template & grid-auto layouts. - https://ryanmulligan.dev/blog/grid-gap

#css

Handling Environment Variables in Vue

This blogpost provides a guide to working with your env file in a Vue.js project. - https://fadamakis.com/handling-environment-variables-in-vue-da4d223aea71

#vue

ECMAScript 2023 Feature: Symbols as WeakMap keys

Dr. Axel continues his look at language features by explaining what WeakMaps are for and why using symbols for keys has added benefits. - https://2ality.com/2024/05/proposal-symbols-as-weakmap-keys.html

#javascript

Advanced Components in Angular

In this blog, I am going to explain several advanced components and mechanisms in Angular that enhance… - https://medium.com/startit-up/advanced-components-in-angular-41b43556178d

#angular

How To Share States Between React Micro-Frontends using Module-Federation?

Share states between React Micro-Frontends using Module-Federation and Bit! - https://blog.bitsrc.io/how-to-share-state-between-react-micro-frontends-using-module-federation-f3762996c208

#react

Scoped CSS is Back

Keith J. Grant gives a nice look at the current state of Scoped CSS, explaining that a working prototype is already in Chrome. - https://keithjgrant.com/posts/2023/04/scoped-css-is-back

#css

3 Kinds of Props in Vue

Vue's props streamline data flow between parent and child components. There are three main types: Template, Configuration, and State (Data) Props. This article explores each type, their differences, and best use cases. - https://michaelnthiessen.com/3-kinds-of-props

#vue

Node.js Test Runner: A Beginner's Guide

Modern versions of Node have their own test runner built in. - https://betterstack.com/community/guides/testing/nodejs-test-runner/

#nodejs

Technical Debts in Component Design using Angular

In one of my previous posts I have talked about code smells in Angular [1]. This time I would like to address… - https://blog.stackademic.com/technical-debts-in-component-design-using-angular-87af0bd4ede3

#angular

Data Fetching Patterns in Single-Page Applications

With a level of depth you’d expect on Martin Fowler’s blog, Atlassian’s Juntao Qiu walks through five different patterns to consider when fetching remote data, using a realistic React-based scenario to show them off. - https://martinfowler.com/articles/data-fetch-spa.html

#react

Stop using {} in Typescript

In the world of TypeScript, it’s pretty common to use ‘Object’ or ‘{}’ as a type when we’re expecting an… - https://medium.com/@sukheja.varun/stop-using-in-typescript-ed24d3532d9e

#typescript

A Conceptual Model of State in Vue 3.4

As web applications become more complex, managing state and componentization in the frontend is challenging. Vue 3.4's defineModel macro offers an efficient way to handle complex inter-component state management while maintaining strong data locality and compartmentalization. This blogpost provides all you need to know about this macro. - https://chrlschn.dev/blog/2024/01/a-conceptual-model-of-state-in-vue-34-using-definemodel/

#vue

Detect JavaScript Support in CSS

The webpage contains a technical blog post that discusses a method for detecting JavaScript support in CSS using the "@supports" rule. The author provides code examples and explains the benefits of this approach for creating more flexible and dynamic stylesheets. - https://ryanmulligan.dev/blog/detect-js-support-in-css/

#css

Node is Leaking Memory? setTimeout Could Be The Reason

The folks at Sentry were running into problems with how Node handles timeouts created with setTimeout or, more specifically, problems caused by hanging on to the Timeout objects setTimeout returns.. - https://lucumr.pocoo.org/2024/6/5/node-timeout/

#nodejs

Translating React Apps with i18next and Testing Them with Playwright

A twofer: a step-by-step tutorial on how to use i18next to create a multi-lingual version of your app and the mechanics of testing it with Playwright. - https://wanago.io/2024/05/13/react-internationalization-end-to-end-tests-playwright/

#react

Getting Started with Generative AI in Angular

Vertex AI is Google Cloud platform for state-of-the-art Generative AI including PaLM 2 - https://medium.com/google-cloud/getting-started-with-generative-ai-in-angular-b72737a59982

#angular

Don’t Just LeetCode; Follow the Coding Patterns Instead

What if you don’t like to practice 100s of coding questions before the interview? - https://levelup.gitconnected.com/dont-just-leetcode-follow-the-coding-patterns-instead-4beb6a197fdb

#leetcode

Using Node.js's Test Runner: The Official Guide

A useful new guide on the official Node site to the fundamentals of setting up and using Node’s new test runner functionality, along with snapshot tests  - https://nodejs.org/en/learn/test-runner/using-test-runner

#nodejs

Vue.js tips - How to re-expose slots in wrapping component

In this blogpost the author provides a practical and personal solution to leveraging slots to build reusable Ui components - https://dev.to/aloisseckar/vuejs-tips-how-to-re-expose-slots-in-wrapping-component-1n1

#vue