staltz

The introduction to Reactive Programming you've been missing

(by @andrestaltz)

---

This tutorial as a series of videos

If you prefer to watch video tutorials with live-coding, then check out this series I recorded with the same contents as in this article: Egghead.io - Introduction to Reactive Programming.

---

vitorbritto

Regular Expressions

Basic Syntax

• /.../: Start and end regex delimiters
• |: Alternation
• (): Grouping

millermedeiros

Setup Mac OS X

I've done the same process every couple years since 2013 (Mountain Lion, Mavericks, High Sierra, Catalina) and I updated the Gist each time I've done it.

I kinda regret for not using something like Boxen (or anything similar) to automate the process, but TBH I only actually needed to these steps once every couple years...

paulirish

/* bling.js */

window.$ = document.querySelectorAll.bind(document);

Node.prototype.on = window.on = function (name, fn) {
  this.addEventListener(name, fn);
}

NodeList.prototype.__proto__ = Array.prototype;

ericelliott

Essential JavaScript Links

I no longer mantain this list. There are lots of other very comprehensive JavaScript link lists out there. Please see those, instead (Google "awesome JavaScript" for a start).

d-akara

Experimental Safe JavaScript Navigation

Implemented using ES6 Proxies and Symbols

The purpose of this function is to provide a way to avoid deep nested conditionals when traversing a hierarchy of objects. Some languages use an operator such as '?.' to perform this capability. This is sometimes called safe navigation or null conditional operators.

You can somewhat think of this as how a xpath select works. If any nodes along the path are not found, your result is simply not found without throwing an exception and without needing to check each individual node to see if it exists.

Suggestions for improvements welcome!

evandrix

Here are a list of headless browsers that I know about:

• [HtmlUnit][1] - Java. Custom browser engine. JavaScript support/DOM emulated. Open source.
• [Ghost][2] - Python only. WebKit-based. Full JavaScript support. Open source.
• [Twill][3] - Python/command line. Custom browser engine. No JavaScript. Open source.
• [PhantomJS][4] - Command line/all platforms. WebKit-based. Full JavaScript support. Open source.
• [Awesomium][5] - C++/.Net/all platforms. Chromium-based. Full JavaScript support. Commercial/free.
• [SimpleBrowser][6] - .Net 4/C#. Custom browser engine. No JavaScript support. Open source.
• [ZombieJS][7] - Node.js. Custom browser engine. JavaScript support/emulated DOM. Open source.
• [EnvJS][8] - JavaScript via Java/Rhino. Custom browser engine. JavaScript support/emulated DOM. Open source.

jacob-ebey

import { createHash } from "crypto";
import fs from "fs";
import fsp from "fs/promises";
import path from "path";
import https from "https";
import { PassThrough } from "stream";
import type { Readable } from "stream";
import type { LoaderFunction } from "remix";
import sharp from "sharp";
import type { Request as NodeRequest } from "@remix-run/node";

tj

// Alternative JavaScript Syntax

Person = :(name, address) { @name!, @address! }
Person::inspect = :{ <: "{@name} lives at {@address}" }

tj := Person('TJ', '314 Bessborough ave')
bob := Person('Bob', 'Some place')
[tj, bob].each(:(person){ print(person.inspect()) })

scottjehl

I wanted to figure out the fastest way to load non-critical CSS so that the impact on initial page drawing is minimal.

TL;DR: Here's the solution I ended up with: https://github.com/filamentgroup/loadCSS/

---

For async JavaScript file requests, we have the async attribute to make this easy, but CSS file requests have no similar standard mechanism (at least, none that will still apply the CSS after loading - here are some async CSS loading conditions that do apply when CSS is inapplicable to media: https://gist.github.com/igrigorik/2935269#file-notes-md ).

Seems there are a couple ways to load and apply a CSS file in a non-blocking manner: