Какие вопросы задать, чтобы проверить понимание Promise/async/await?
#list

Сегодня поделюсь подборкой моих вопросов для интервью по Promise/async/await. Естественно без ответов, иначе как мне потом их на собеседованиях спрашивать.

1. Какие методы нативного класса Promise вы знаете?
2. Напишите Promise, который создаст микротаск.
3. Напишите Promise, который создаст макротаск.
4. Приведите пример, когда вам было необходимо использовать Promise.allSettled()
5. Что такое Promise executor и почему он должен быть синхронным?
6. Расскажите, что плохо с вот таким кодом:
new Promise((resolve, reject) => getSomething((err, data) => {
if (err) {
reject(err);
} else {
resolve(data);
}
}));
7. Что произойдет если мы сделаем await дважды? Пример кода:
let counter = 0;
const increment = new Promise(resolve => {
counter++;
resolve();
});
await increment;
await increment;
console.log(counter); // 1? 2? something else?
8. Какое ваше мнение по твиту James M Snell:
Ok, opinions needed: An existing API that returns a Promise currently throws certain errors synchronously. It's changed to return rejected promises (e.g. changing
foo() { throw new Error(); return Promise.resolve() } to async foo() { throw new Error(); return Promise.resolve() }
9. Как отслеживать в #nodejs коде Promise, которые имеют множественный resolve/reject? В каких случаях это указывает на неправильное поведение кода?
10. Каким образом вы работаете с встроенными #nodejs функциями в async/await стиле, которые callback интерфейс?

​​oclif.io – Open CLI Framework
#package

Вчера на Voice Chat Алексей озвучил своей виденье, что правильная организация кода должна позволять сделать из web приложения CLI утилиту. Как правило CLI утилиты написаны на Python (например AWS, GCP). Но есть примеры и на #nodejs: heroku, salesforce, twilio. Они все написаны на фреймворке oclif. У него отличная документация, возможность сразу делать упаковку в исполняемый файл под нужную операционку, публикация на S3, поддержка typescript и отличное комьюнити. Однозначный выбор для тех.стэка в проект, которому необходима CLI утилита.

Когда и как использовать navigator.sendBeacon?
#web_api

Сегодня обсудим Web API navigator.sendBeacon. Beacon API используется для отправки асинхронного и неблокирующего запроса на веб-сервер. Запрос не ожидает ответа. В отличие от XMLHttpRequest или Fetch-based запросов, браузер гарантирует отправку запрос до закрытия страницы или перехода на другую. Поэтому данный API рекомендованный способ для отправки аналитических данных. Его синтаксис:
navigator.sendBeacon(url);
navigator.sendBeacon(url, data);
На данный url будет отправлен POST запрос. Его Content-Type будет зависит от аргумента data. По умолчанию это 'text/plain; charset=UTF-8'. Чтобы #nodejs код мог работать с таким типом контента необходимо включить соотвествующий парсер. В express это app.use(bodyParser.text());. Данные необходимо будет десерилизовать из текста.

Чтобы работать с application/json, клиент должен использовать такой код:
const blob = new Blob([JSON.stringify(data)], { type: 'application/json' });
navigator.sendBeacon(url, blob);
Тогда на сервере мы сразу получаем JSON, с которым удобно работать.

Используйте данное API для построение своей системы аналитики.

Ссылки:
🔗 MDN
🔗 Can I use

​​Есть такой проект Best of JS. Его автор каждый год делает топ OpenSource JS библиотек набравшие за год наибольшее количество звезд на GitHub. Топ разбит на категории. В категории #nodejs frameworks картина такова:
1. Next.js – находиться в категории из-за позиционирования как фулстэк фреймворк.
2. Nest.js – top-1 для BE разработки
3. Strapi – вложено очень много в маркетинг, осваивают инвесторские деньги.

Посмотреть итоги года можно тут: 2021 JavaScript Rising Stars.

​​Обновление Open Machine Learning Course

Yorko (Юрий Кашницкий) зарелизил обновленную версию mlcourse.ai. Раньше он проходился в когортах, теперь его можно пройти в self-paced режиме. Я сам проходил этот курс. Знания из курса помогли построение процессов с Data Science инженерами.

Почему я его рекомендую для ознакомления #nodejs разработчикам? Во-первых, для прокачки эрудиции и T-shaped экспертизы. Во-вторых, все чаще API должны забирать данные из Machine Learning моделей, а значит понимание как они работают упрощают интеграцию.

Рецепты по теме:
– Как технологии будут востребованы для Node.js разработки в 2022?

Как отследить работу Garbage Collector?
#web_api #nodejs_api

Плохая организация JavaScript кода может привести к утечке памяти. Для отслеживания утечки ресурсов в ES2021 появился FinalizationRegistry. Так можно вызвать callback после отработки Garbage Collector по указанному ресурсу:
const registry = new FinalizationRegistry((startTime) => {
const delay = ((Date.now() - startTime) / 1000).toFixed(1);
console.log(`foo was garbage collected after ${delay}s`);
});
let foo = {};
registry.register(foo, Date.now());
foo = undefined; // Clear strong reference

⚠️Пример максимально упрощен. При запуске без массового создания новых объектов ждать сборки мусора придется долго.

Авторы не рекомендует использовать для построение бизнес логики, реализация сборки мусора, зависит от реализации любого конкретного движка JavaScript.

Работает в #nodejs 14.6.0 и новее. Для работы в TypeScript необходимо включить es2021.weakref.

Ссылки:
🔗 пример для запуска в браузере
🔗 MDN
🔗 TC39
🔗 Can I use

Как работать с Event Emitter в async/await стиле?
#nodejs_api

В 2022 году асинхронных #nodejs код строиться на async/await. Однако важный модуль Event Emitter построен на callback-ах. Начиная с 12.16 версии в нем есть встроенный функционал для упрощения работы с Promise. За это отвечают две функции:
events.on(emitter, eventName[, options]) – возвращает AsyncIterator, который легко итерировать конструкцией for await
events.once(emitter, name[, options]) – возвращает Promise, который будет разрешен по событию.
В 16 Node.js добавили options для передачи AbortController.

Упрощенный пример кода демонстрирующий обе функции:
const events = require('events');
const { setTimeout } = require('timers/promises');
const server = require('http').createServer();

async function handle(req, res) {
await setTimeout(200);
res.end('Hello World');
}

async function bootstrap() {
server.listen(8080);
await events.once(server, 'listening')
for await (const [req, res] of events.on(server, 'request')) {
await handle(req, res);
}
}

bootstrap();

⚠️В пример await handle, сделано для демонстрации работы AsyncIterator. В результате такой конструкции HttpServer будет обрабатывать запросы не параллельно, а последовательно. Чтобы это исправить можно убрать await на этой строке.

Ссылки:
⚙️ Код на runkit
📕 Документация events
👩‍🍳 Обзор AbortController

Как узнать является ли текущий файл точкой запуска?
#nodejs_api

Точка запуска (entry point) это файл, который указывается в качестве аргумента в команде node file_name.js. Зачем знать является ли текущий файл точкой запуска? Чтобы правильно организовывать код. Например, вы можете стартовать web server или экспортировать его для последующего использования в тестах.

Для проверки с CommonJS (стандарт в Node.js) используется require.main или его аналог process.mainModule. Пример, кода:
if (require.main === module) {
console.log('Entry point');
} else {
console.log('Not entry point');
}

Для ES модулей код выглядит так:
import { fileURLToPath } from 'url';
if (process.argv[1] === fileURLToPath(import.meta.url)) {
console.log('Entry point');
} else {
console.log('Not entry point');
}

Топ-5 заблуждений об работе JavaScript
#nodejs_api

На календаре пятница, а значит пора сбавить градус практичности. Сегодня поделюсь "перлам" с собеседований. Цель поста – ликвидация безграмотность.

👎Все логические операторы (&&, ||, !) возвращают булевы значения.
Вообще-то только ! возвращает Boolean.
Вопрос для выявления заблуждения, что будет выведено: console.log('0' && 3)

👎Расчет возвращаемого Promise-ом значения будет запущен при await.
Нет, он будет запущен в момент создания, т.е. как только мы создали Promise мы сразу запустили цепочку (promise chain). Где вы ставите await, и ставите ли, не имеет значения.

👎Все аргументы в функциях работают одинаково.
Как и в других языках программирования примитивные и ссылочные типы ведут себя по разному.
Вопрос для выявления заблуждения, что плохо в коде:
function getTomorrow(d) {
d.setDate(d.getDate() + 1);
return d;
}

👎Обработка событий происходит асинхронно.
Ошибка характерна и для Node.js с Event Emitter, и для FE разработчиков с Browser Events. Event handler-ы работают синхронно, причем их порядок вызова зависит от порядка добавления.

👎JavaScript обладает идеальной точностью арифметики.
Уже столько раз писали, о том что 0.1 + 0.2 == 0.3 это false, что многие это зазубрили. Однако, об этом забывают в доменах, где ошибка округления критична (финансы и т.п.). В таких случаях стоит использовать BigInt или подобные решения.

Chrome 98 - What’s New in DevTools
#worth_seeing

1 февраля будет следующий релиз Chrome. В нем будет много обновлений в инструментах разработчика. Чтобы быть в курсе предлагаю посмотреть 6 минутное видео или почитать текстовое описание.

Большинство новшеств орентированы на фронтенд разработку. Для #nodejs и fullstack разработчиков будут интересны:
👉 Back/Forward cache tab, чтобы убедиться что сервер отдает правильные заголовки
👉 связка document.designMode + Changes tab, чтобы отредактировать прямо в браузере и скопировать в исходный код.

Ссылки:
👀Видео
📕Текстовая версия