JavaScript
31.6K subscribers
1.17K photos
10 videos
33 files
842 links
A resourceful newsletter featuring the latest and most important news, articles, books and updates in the world of #javascript ๐Ÿš€ Don't miss our Quizzes!

Let's chat: @nairihar
Download Telegram
๐ŸคŸ Node.js 26.0 (Current) Released

It's here! Complete with the Temporal API enabled by default, V8 14.6 (say hello to map โ€˜upsertโ€™ methods like Map.prototype.getOrInsert() and iterator sequencing with Iterator.concat()), plus Undici 8. v26 is the โ€˜Currentโ€™ cutting-edge release until October when it gets promoted to LTS.

Rafael Gonzaga
Please open Telegram to view this post
VIEW IN TELEGRAM
โค4๐Ÿ”ฅ3๐Ÿ‘2๐Ÿคฉ1
CHALLENGE

const items = [
{ name: "banana", price: 1.5, qty: 10 },
{ name: "apple", price: 1.5, qty: 5 },
{ name: "cherry", price: 3.0, qty: 8 },
{ name: "date", price: 2.0, qty: 8 },
];

const sorted = [...items].sort((a, b) => {
if (a.price !== b.price) return a.price - b.price;
if (a.qty !== b.qty) return b.qty - a.qty;
return a.name.localeCompare(b.name);
});

console.log(sorted.map(i => `${i.name}:${i.qty}`).join(", "));
๐Ÿ”ฅ4โค2
๐Ÿ˜ฎ html-to-text 10.0: Advanced HTML to Text Converter

Uses a variety of techniques to convert even complex HTML into plain text (but with some formatting, such as for tables). v10 brings the project up to modern standards.

KillyMXI
Please open Telegram to view this post
VIEW IN TELEGRAM
โค4๐Ÿ‘1
CHALLENGE


class DatabaseError extends Error {
constructor(message, code) {
super(message);
this.name = "DatabaseError";
this.code = code;
}
}

class ConnectionError extends DatabaseError {
constructor(host) {
super(`Failed to connect to ${host}`, 503);
this.name = "ConnectionError";
this.host = host;
}
}

const err = new ConnectionError("db.server.io");

console.log([
err instanceof ConnectionError,
err instanceof DatabaseError,
err instanceof Error,
err.name,
err.code,
err.message,
].join(" | "));
๐Ÿ”ฅ1
What is the output?
Anonymous Quiz
34%
true | true | true | DatabaseError | 503 | Failed to connect to db.server.io
22%
true | false | true | ConnectionError | 503 | Failed to connect to db.server.io
30%
true | true | true | ConnectionError | 503 | Failed to connect to db.server.io
๐Ÿ‘€ Remix 3 Enters Beta โ€” It's No Longer a React Framework

Remix has quite the back story. Created by the duo behind React Router in 2020 and seen as an alternative to Next.js, Remix was acquired by Shopify in 2022 and its core ideas folded into React Router v7 in 2024. Now, a new direction: a full-stack, web standards-first framework with its own UI component model andโ€ฆ no React.

Michael Jackson (Remix)
Please open Telegram to view this post
VIEW IN TELEGRAM
โค6๐Ÿ‘2๐Ÿ”ฅ2
CHALLENGE

const compose = (...fns) => (x) => fns.reduceRight((acc, fn) => fn(acc), x);
const pipe = (...fns) => (x) => fns.reduce((acc, fn) => fn(acc), x);

const double = (x) => x * 2;
const addTen = (x) => x + 10;
const square = (x) => x ** 2;
const negate = (x) => -x;

const transform1 = compose(negate, square, addTen, double);
const transform2 = pipe(double, addTen, square, negate);

const memoize = (fn) => {
const cache = new Map();
return (x) => {
if (!cache.has(x)) cache.set(x, fn(x));
return cache.get(x);
};
};

const memoTransform1 = memoize(transform1);

console.log(transform1(3));
console.log(transform2(3));
console.log(memoTransform1(3) === transform1(3));
โค1
๐Ÿ‘€ Anime.js 4.4: The Flexible JavaScript Animation Engine

At ten years old, the โ€˜animate anything from JavaScriptโ€™ library continues to get even better with a new scrambleText effect and auto-grid layout mode for stagger grids. The docs for Anime are truly top-tier and packed with examples.

Julian Garnier
Please open Telegram to view this post
VIEW IN TELEGRAM
โค5๐Ÿ‘2๐Ÿ”ฅ1๐Ÿคฉ1
CHALLENGE

function processData(value) {
let result = "start";

try {
result += " -> try";
if (value === null) throw new TypeError("Null value");
if (value < 0) throw new RangeError("Negative value");
result += " -> success";
return result;
} catch (e) {
result += ` -> catch(${e.constructor.name})`;
return result;
} finally {
result += " -> finally";
console.log(result);
}
}

console.log(processData(null));
โค2๐Ÿ‘1๐Ÿ”ฅ1๐Ÿคฉ1
๐Ÿค” How can you not love a project homepage where you're a cat in a convertible driving through an endless barrage of obstacles? Crashcat is a JavaScript 3D rigid body physics library built for games, simulations, and web experiences, complete with numerous fun examples.
Please open Telegram to view this post
VIEW IN TELEGRAM
โค4๐Ÿ”ฅ2๐Ÿ‘1
CHALLENGE


function createCounter() {
let count = 0;

return {
increment() { count++; },
decrement() { count--; },
getCount() { return count; },
reset: () => { count = 0; }
};
}

const counter = createCounter();
counter.increment();
counter.increment();
counter.increment();
counter.decrement();

const { getCount, reset } = counter;

console.log(counter.getCount());
reset();
console.log(getCount());
โค2๐Ÿ‘1
What is the output?
Anonymous Quiz
21%
undefined 0
24%
2 1
45%
2 0
10%
3 0
๐Ÿค”2โค1๐Ÿคฉ1
CHALLENGE

class Pipeline {
#value;
#log = [];

constructor(value) {
this.#value = value;
}

map(fn) {
this.#value = fn(this.#value);
this.#log.push(`map:${this.#value}`);
return this;
}

filter(fn) {
if (Array.isArray(this.#value)) {
this.#value = this.#value.filter(fn);
this.#log.push(`filter:${this.#value}`);
}
return this;
}

reduce(fn, init) {
if (Array.isArray(this.#value)) {
this.#value = this.#value.reduce(fn, init);
this.#log.push(`reduce:${this.#value}`);
}
return this;
}

result() {
console.log(this.#log.join(' | '));
return this.#value;
}
}

new Pipeline([1, 2, 3, 4, 5, 6])
.filter(n => n % 2 === 0)
.map(arr => arr.map(n => n ** 2))
.reduce((acc, n) => acc + n, 0)
.result();
โค3๐Ÿ‘3๐Ÿ”ฅ1
๐ŸŒฒ NodeBook: An Advanced Guide to Node.js Internals

Volume I of this in-depth guide is now complete with eight chapters of advanced material covering topics like event loop internals, what V8 does, buffer allocation, streams, module resolution, async/await, and the process lifecycle.

Ishtmeet Singh
Please open Telegram to view this post
VIEW IN TELEGRAM
๐Ÿ‘5โค2๐Ÿคฉ2๐Ÿ”ฅ1
CHALLENGE

const name = "Taylor";
const age = 28;
const role = "engineer";

const user = {
name,
age,
role,
greet() {
return `Hi, I'm ${this.name}, age ${this.age}`;
},
get info() {
return `${this.role.toUpperCase()} @ ${this.age}`;
}
};

const { name: userName, info, greet } = user;

console.log(userName);
console.log(info);
console.log(greet.call({ name: "Jordan", age: 35 }));
๐Ÿ”ฅ1
๐ŸŒŸ Bun v1.3.14 Adds Image Processing, HTTP/3, HTTP/2 Fetch and More

Another mammoth Bun release. Bun.Image is a new built-in image processing API which can replace Sharp in many cases. Bunโ€™s package manager has added a global virtual store (akin to pnpmโ€™s), Bun.serve has experimental HTTP/3 over QUIC support, and fetch gets HTTP/2 and HTTP/3 support. Plus the usual raft of Node.js compatibility improvements.

Jarred Sumner
Please open Telegram to view this post
VIEW IN TELEGRAM
โค4๐Ÿ‘4๐Ÿค”1