Articles on Javascript

Last updated: 2023/02/27

Top deep-dives on Javascript

A Gentle Introduction to Using a Docker Container as a Dev Environment

If you haven't used Docker or are unfamiliar with containers as an idea, you're doing something wrong. Being able to launch an entire application in its own environment, independent of what's on your computer, is an amazing feature for programmers. Burke Holland's satirical writing explores how to run a web application in a remote container using VS Code. Although he uses the *cough* inferior *cough* OS known as Windows (fight me, I'm an Arch Linux user), I'll forgive him for the breadth of points he covers in regards to getting things running with containers.

5 TILs about Node.js Fundamentals from the Node.js Design Patterns Book

It's good to know about how the framework you're using works. No brainer.

Leveraging Declarative Programming to Create Maintainable Web Apps

So you know that I'm trying to delve more into design patterns and programming paradigms in order to improve my coding productivity. Declarative programming is one of the patterns I stumbled upon, and it focuses on the logic of a computer rather than its control flow. Peter Suggate's extensive article applies the principle to a web application, and exemplifies it by using a finite state machine to control front end UI processes.

Modern web apps without JavaScript bundling or transpiling

The state of web development 10 years ago was probably pretty depressing and frustrating. However, in the past decade, a lot has changed in terms of developer comfort. David Heinemeier Hansson explains how bundlers, one of the parts of the software chain that make web development a hassle, are being made obsolete by HTTP2 and growing browser support for ES6.

Polymorphism without objects via multimethods

If you write code, you're definitely vaguely familiar with OOP, and probably at some point debated FP vs OOP vs DOP (data-oriented). Well in this article, Yehonathan Sharvit explores how concept very central to OOP can be reimplemented using a functional/data-oriented approach. Is it really an improvement on the OOP implementation? YOU DECIDE!

How to Conditionally Add Attributes to Objects

There are a ton of situations where it's useful to conditionally add something to an object in JavaScript, like when you're submitting data with a form and some fields are optional. In this ultra-short article (this summary might be longer?), David Walsh shows how you can use ?? (nullish coalescing operator) in JavaScript to conditionally add key/value pairs to objects.

The Philosophy of Svelte

"Great DX shouldn't come at the expense of great UX". That's how Matt Stobbs starts the article, describing Svelte's philosophy. If you're not in the know, Svelte is a lovely new web dev framework. Matt covers Svelte's philosophy from his perspective and a couple of the things (with examples) that make Svelte different from other popular frameworks.

Understanding JavaScript IIFEs Like a Boss

Functions are a big part of JavaScript, and there are actually a lot of intricacies to them, especially when it comes to scoping. In this article, Mahdhi Rezvi does a deep dive into JavaScript's Immediately Invoked Function Expression, describing what they are, different variations of them, and a number of use cases which I was previously not aware of.

Understanding Memory Leaks in Nodejs

When you're writing JavaScript code for Node, you don't really have to think about memory too much. This is a blessing and a curse; on one hand it abstracts away details, allowing you to focus on creating on a higher level, while on the other hand, those details are pretty important. In this informative article, Chidume Nnamdi explains how the memory model works for JavaScript, the basics of the garbage collector, and all of the different ways memory leaks are created (with examples).

How to convert between callbacks and Promises in Javascript

Await/async are my go to in most JavaScript programming, since I personally think it makes code much more readable and easier to reason about. Unfortunately, not all JavaScript code has caught up (or shares the same opinion), and often times you might have to work with callbacks. In that case, Tamás Sallai has written an article where you can learn how to switch between the two, reimplementing any legacy (or poorly written code) into your perferred solution.

Creating a JavaScript promise from scratch, Part 1: Constructor

Promises are a huge part of web development with JavaScript. Being able to run code knowing that it can use the data received from an external source is huge. But how do these promises work? Nicholas C. Zakas has written series that builds this essential component from the ground up. I think there's no better way to get to know a feature than making it from scratch.

JavaScript Visualized: Event Loop

Old, but still very relevant and very cool. Lydia Hallie's series focuses on making complicated JavaScript features into easy to understand visualizations.

Implementer's Guide to WebSockets

Want to put some code to a protocol (bastardization of putting a face to a name)? As a follow up on yesterday's article about web communication protocols, the author of this article completely implements a peer-to-peer ready, WS13 protocol supported websocket in JavaScript, with a focus on "the underlying network protocol and frame parsing mechanisms".

An additional non-backtracking RegExp engine

Regex is one of the areas of programming I feel conflicted about. On one hand, regex can be very useful, on the other hand, they sometimes cause more problems than they fix. Martin Bidlingmaier presents the introduction of a nonback-tracking regex engine that can be used with JavaScript's V8. Martin demonstrates the backtracking issue it aims to solve, and explains how.

Exploring Node.js Async Hooks

Async/await is popular syntax in quite a few languages. It's especially useful in JavaScript, and looks a lot better (because it's easier to understand) than the promises. In this informative article, Diogo Souza explores async_hooks, a native way in Node JavaScript to keep log or keep track of async functions. Diogo shows a few use cases, that might inspire you to implement them in your own project!

Local File Inclusions, explained

Using the Platform

How feasible is it to build a site using purely vanilla javascript? What is it like to maintain or build on? Elise Hein's article illuminates the current state of building a site using pure vanilla javascript. Elise especially focuses on ES6 modules and Web Components.

Floating Point in the Browser, Part 3: When x+y=x

My motto for this newsletter is that you find inspiration in unexpected places. I think that rings especially true when you're debugging code, and the solution comes from some past or obscure material you once read. In this diagnostic article, Bruce Dawson demonstrates how seemingly unrelated knowledge about floating point addition came in handy when debugging a problem in Chromium.

Eloquent JavaScript

It's not an article, but a full book. Marijn Haverbeke covers all aspects of modern JavaScript, with code and examples.

Hack Pipe for Functional Programmers: How I learned to stop worrying and love the placeholder

Functional programming in Javascript is no new thing, but usually requires third-party packages to take full advantage of it. More and more though, features from these packages are leaking into the core language. In this exploratory article, James DiGioia explains how and why he changed his mind in regards to the implementation of a pipe operator, from the F# style, to Hack style.

Testing Without Mocks: A Pattern Language

James Shore discusses the importance of automated tests and the various ways to write them. The author describes the problems with the easy, obvious way to write tests and the benefits of using mocks and spies. He also describes the problems with using mocks and spies and how they can be avoided. The article is broken up into bite-sized pieces with lots of code examples.
Some highlights:

  • You have to adjust production code to work for tests (using an off switch)
  • Tests become more "sociable", meaning multiple can fail from a single bug
  • There's a long list of benefits for not mocking things for tests

Creating a JavaScript promise from scratch, Part 3: then(), catch(), and finally()

In the not-so-distant past we've had the previous article in this series on the newsletter. Well Nicholas C. Zakas doesn't disappoint in this one either, where he covers some of the key aspects of Promises in JavaScript. Specifically Nicholas covers the topics mentioned in the title, which are responsible for what happens next in the Promise's life cycle.

Bridging the Object-Oriented and Functional Divide with the Visitor pattern

Joseph Junker discusses how the visitor pattern can be used to mix functional and object oriented programming in a beneficial way.
Some highlights:

  • The visitor pattern enables a beneficial mixing of functional and object oriented programming and has a deep and rigorous connection to type theory
  • Functional programming makes it easy to define new functions, and hard to add new data, object oriented programming makes it easy to define new data, and hard to add new functions
  • Can make the visitors more lightweight by just making them into TS/JS objects

An Intro to JavaScript Proxy

Mostly commonly in the software engineering world, a proxy can be thought of as a middleman between two points. This is pretty obvious in a networking environment, but how does it apply in JavaScript? In this thorough article, Travis Almand explores how a JavaScript proxy can be used to intercept an Object's functions, presenting "them as ways to extend some common JavaScript tasks with more control over data".

Experimenting with remote debugging: Node.js runtime code injection

Injecting code into remote processes isn't the safest thing to do, and is actually a common way for malicious actors to get existing processes to run code that the actor has written. Nonetheless, it's interesting to know how it's done. In this informative article, Vladimir takes "a running Node.js HTTP server and, from another local Node.js process, [injects] a script into it to make it log all incoming HTTP requests".

Understanding Garbage Collection in JavaScriptCore From Scratch

Haoran Xu does a deep-dive on the JavaScript compiler by starting out with a simple design and progressively developing it towards the actual implementation.

A pipe operator for JavaScript: introduction and use cases

Dr. Axel Rauschmayer dives into the two competing proposals for the pipe operator in JavaScript.

Etsy’s Journey to TypeScript

Migrating a huge project can be a huge bummer. But if you gotta do it, you gotta do it. So what's the best approach? Who knows. But in this article, Salem Hilal describes how the Etsy team handled migrating their massive JavaScript monorepo to TypeScript, presenting their strategy, and then focusing on technical details of optimizing using types.

Video processing with WebCodecs

With the explosion of streaming services, like streaming movies, TV shows, or people live streaming, streaming libraries for browsers have also popped up all over the place. One disadvantage with most of these libraries is that they don't allow you to manipulate lower level features. Eugene Zemtsov has written an article introducing the WebCodecs API, which give developers access to browser built-in features like "video and audio decoders, video and audio encoders, raw video frames, and image decoders". Eugene also explains the workflow and provides examples for each of the individual components.

Crypto Markets Recover Amid COVID-19 Fears

The world of JavaScript is kind of this amalgamation of programming paradigms, architecture features, and buzzwords. As a result of that, sometimes it's necessary to take an overhead view of the whole situation, to get an understanding of where things are at and where they're going. In this aggregating article, Ryan Carniato explains MPA vs SPA, explores React vs Reactivity, highlights VDOM vs No VDOM, and compares a number of other features, giving a good overview of key concepts that are currently relevant, with a plethora of links to follow up material.

An in-depth perspective on webpack's bundling process

This article is from one of the readers of the newsletter! Web developers often have to deal with bundlers, which are tools that help coalesce all of the different files and file types that go into making a modern website. Webpack is one of the most popular tools for this, and in this extensive article, Andrei Gatej thoroughly explains its inner workings.

Making a falling sand simulator

Jason McGhee demonstrates how to implement an 8-bit styled sand falling simulator in JavaScript.

Karen on Python mocks: threading.Timer

Refactoring is a big part of any kind of programming, because any project you'll work on will have some sort of technical debt. We all sometimes take shortcuts. Well Pablo Aguiar has taken a great meme, good ol' Karen, and put her to work rewriting unit tests for lazy Python devs that used time.sleep on asynchronous functions.

Reconstructing TypeScript, part 1: bidirectional type checking

TypeScript is a superset of JavaScript, that includes compile time type checking (not runtime, unfortunately?), is written in itself, and compiles to plain ol' JavaScript. If you're familiar with it, you might've thought, how does it actually handle types? In this specific article of the series, Jake Donham implements bidirectional type checking via an AST, among other things.

JavaScript metaprogramming with the 2022-03 decorators API

Dr. Axel Rauschmayer explains what JavaScript decorators are and how they can be used.
Some highlights:

  • Their latest version is already supported by Babel and will soon be supported by TypeScript
  • Decorators are a keyword that starts with an symbol and can be put in front of classes and class members (such as methods) to enable a number of different functionalities
  • They are mostly an object-oriented feature and popular in OOP frameworks and libraries
  • First look: adding type annotations to JavaScript

    Dr. Axel Rauschmayer presents the new proposal for types in JavaScript.

    Sometimes, it is a compiler bug

    Matthew Glazar takes on a debugging journey through a C++ compiler and assembly code, all in the aim of fixing a misplaced squiggly line generated by a JavaScript linter.

    Why Train When You Can Optimize?

    Justin Meiners illuminates the wonderful world of optimization by implementing a drawing assistant in JavaScript that'll help you draw straight lines, circles, and squares on a canvas.

    V8 release v8.6

    V8 is the engine that powers JavaScript in the browser and in NodeJS. With Google constantly working on it, it continues to get better and better. In this round of updates, Ingvar Stepanyan describes what these updates are made up, specifically an opensource JS-Fuzzer, speed-ups in Number.prototype.toString, the renaming of Atomics.wake, the Single Instruction, Multiple Data propsal on Liftoff (WebAssembly compiler), faster Wasm-to-JS calls, and detecting pending background tasks with Isolate::HasPendingBackgroundTasks.

    Creating a JavaScript promise from scratch, Part 4: Promise.resolve() and Promise.reject()

    Make Beautifully Resilient Apps With Progressive Enhancement

    Austin Gil shows how to build out a simple pizza ordering form and server routing using progressive web app techniques to account for users who have JavaScript disabled.

    How do primitive values get their properties?

    Dr. Axel Rauschmayer looks at the code and specifications of how JavaScript primitive values get all of their peripheral properties.

    Why would anyone need JavaScript generator functions?

    James Sinclair talks about generators in JavaScript, and demonstrates how they can be used for lazy iterators, infinite iterators, and message passing.
    Some highlights:

    • Generators are rarely used
    • Laziness allows you to process large data sets by loading one item at a time into memory
    • There aren't a lot of built in iterator utility functions

    Detecting pitch with the Web Audio API and autocorrelation

    Alex Ellis plays with the Web Audio API to detect pitch.

    implementing ShadowRealm in WebKit

    Joseph Griego presents the proposed addition of ShadowRealms to the JavaScriptCore JS engine, and describes what they are, how they can be used, and the intricacies of their implementation in C++.

    Writing my own build system: Coupling gulp concepts with modern JavaScript

    Wladimir Palant replaces streams with async generators and does some tweaks to API calls/adds some helpers while rewriting a build system in JavaScript.

    Slack Tracking in V8

    "Slack tracking is a way to give new objects an initial size that is larger than what they may actually use, so they can have new properties added quickly. And then, after some period of time, to magically return that unused space to the system". This is useful for JavaScript because it doesn't have static classes. Michael Stanton has written an extensive article that dives into how this feature is implemented in the V8 engine, accompanied by lots of code and diagrams.

    Optimizing Content Migrations With Edge Compute

    Austin Gil describes how one could redirect traffic using edge computing as an alternative to NGINX.

    Efficient and Flexible Model-Based Testing

    Alex Weisberger discusses how to upgrade one's model-based testing strategy.
    Some highlights:

    • An action is a transition in a state machine/state transition system
    • Talks about the theoretical concepts of refinement mappings and auxiliary variables
    • Refinement mappings overcome both state incompatibility and the need for action sequences

    Escaping misconfigured VSCode extensions

    This two-part blog series covers how Vasco Franco found and disclosed three vulnerabilities in VSCode extensions and one vulnerability in VSCode itself.
    Some highlights:

    • The underlying cause of each vulnerability is identified and fully working exploits are demonstrated
    • Recommends ways to prevent similar issues from occurring in the future
    • The first part of the series focuses on vulnerabilities in VSCode extensions, in particular two Microsoft extensions: SARIF viewer and Live Preview

Want to see more in-depth content?

subscribe to my newsletter!

Other Articles