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.

---

patriciogonzalezvivo

Please consider using http://lygia.xyz instead of copy/pasting this functions. It expand suport for voronoi, voronoise, fbm, noise, worley, noise, derivatives and much more, through simple file dependencies. Take a look to https://github.com/patriciogonzalezvivo/lygia/tree/main/generative

Generic 1,2,3 Noise

float rand(float n){return fract(sin(n) * 43758.5453123);}

float noise(float p){
	float fl = floor(p);
  float fc = fract(p);

addyosmani

CSS Layout Debugger

A tweet-sized debugger for visualizing your CSS layouts. Outlines every DOM element on your page a random (valid) CSS hex color.

One-line version to paste in your DevTools

Use $$ if your browser aliases it:

~ 108 byte version

tonyg

# Copyright (c) 2015 Tony Garnock-Jones <[email protected]>
#
# Permission is hereby granted, free of charge, to any person
# obtaining a copy of this software and associated documentation files
# (the "Software"), to deal in the Software without restriction,
# including without limitation the rights to use, copy, modify, merge,
# publish, distribute, sublicense, and/or sell copies of the Software,
# and to permit persons to whom the Software is furnished to do so,
# subject to the following conditions:
#

paulirish

What forces layout / reflow

All of the below properties or methods, when requested/called in JavaScript, will trigger the browser to synchronously calculate the style and layout*. This is also called reflow or layout thrashing, and is common performance bottleneck.

Generally, all APIs that synchronously provide layout metrics will trigger forced reflow / layout. Read on for additional cases and details.

Element APIs

Getting box metrics

• elem.offsetLeft, elem.offsetTop, elem.offsetWidth, elem.offsetHeight, elem.offsetParent

srdjan

100+ different js counter apps...

gvergnaud

/* ----------------------------------------- *
        Lazy List Implementation
* ----------------------------------------- */

// Haskell-like infinite List, implemented with es6 generators

// Lazyness lets you do crazy stuff like
List.range(0, Infinity)
  .drop(1000)
  .map(n => -n)

brendanzab

Functional, Reactive, and Distributed Systems Bibliography

Books

• CQRS Journey: Free ebook from Microsoft (Print book available for purchase)
• Functional and Reactive Domain Modeling: A high level overview of how to build up domain models using free monads and interpreters.
• Reactive Microservices Architecture: Free booklet from Lagom and O'Reilly
• Reactive Messaging Patterns with the Actor Model: Applications and Integration in Scala and Akka
• Domain-Driven Design: Tackling Complexity in the Heart of Software

dmnsgn

A non-exhaustive list of WebGL and WebGPU frameworks and libraries. It is mostly for learning purposes as some of the libraries listed are wip/outdated/not maintained anymore.

Engines and libraries ⚙️

Name	Stars	Last Commit	Description
three.js	![GitHub

fgilio

/*
 * Handling Errors using async/await
 * Has to be used inside an async function
 */
try {
    const response = await axios.get('https://your.site/api/v1/bla/ble/bli');
    // Success 🎉
    console.log(response);
} catch (error) {
    // Error 😨