Dev Notes [RU]
10 subscribers
10 links
Добро пожаловать на мой канал! 🌟
Здесь я делюсь своими мыслями, идеями, хаками и захватывающими открытиями.

EN версия здесь: @thedevnotes
Download Telegram
Эффективное управление параллельными задачами в JavaScript

Привет! 🖖

Внезапно решил поделиться своим опытом работы с p-limit. Эта библиотека позволяет контролировать количество одновременно выполняющихся асинхронных операций, что особенно полезно при работе с ресурсозатратными или ограниченными API.

Почему это важно?
Во время работы с большим количеством асинхронных задач, например, запросов к API или операций ввода-вывода, выполнение всех задач одновременно может привести к перегрузке системы или превышению лимитов API. Для избежания данной ситуации и улучшения производительности приложения необходимо ограничивать количество параллельных задач.

В целом, документация проекта предельно ясна. Я лишь покажу верхушку айсберга.

Установка производится как обычно, через любой менеджер пакетов. Я предпочитаю pnpm, но приведу пример для npm:


npm install p-limit


Для проектов CommonJS:

npm install p-limit@3.1.0


Предположим, что у нас есть массив асинхронных задач и хотим ограничить выполнение до 2-х параллельных выполнений:


const pLimit = require('p-limit');

const limit = pLimit(2); // Ограничение до 2 одновременных задач

const tasks = [
async () => { /* Задача 1 */ },
async () => { /* Задача 2 */ },
async () => { /* Задача 3 */ },
async () => { /* Задача 4 */ }
];

const limitedTasks = tasks.map(task => limit(task));

Promise.all(limitedTasks).then(results => {
console.log(results);
});


Да, так просто можно решить данную задачу :)

Хочу отметить важный момент. Пакет не поддерживает CJS начиная с версии 4.0.0. Так что либо ставим младшую версию - 3.1.0, либо переводим проект на ESM.

📦 NPM
🔗 GitHub

#npm #полезное #инструменты
2
О визуальных текстовых редакторах

Недавно столкнулся с задачей разработки/интеграции rich-text редактора. Попробовал несколько готовых решений и даже собрал собственное.

Сначала о проекте - на Next.js сайт понадобился визуальный редактор текста с возможностью задавать заголовки и базово форматировать текст. За основу взял Lexical. Это фрейморк от Facebook для создания редакторов текста. Штука очень мощная и невероятно гибкая. По началу все было окей, но когда заказчик запросил доработку, то столкнулся с рядом веселых и не очень проблем. Таким образом я попробовал около 6 разных редакторов и остановился на.. Нет, не Lexical 🥲

Напишу про выбор отдельным постом, а пока кратко о том, почему стоит и нет выбирать Lexical:
+ Гибкий. Он действительно гибкий и позволяет сделать все, что душе захочется. Если фокусироваться на разработке кастомного редактора, то смотрите в сторону именно Lexical.
+ Современный. Проект активно поддерживается и развивается, вопрос к используемым технологиям не возникает
+ Компактный. Нет желания тащить на фронт громоздкий редактор в котором половина функций не будет использоваться? Lexical.

Теперь к минусам:
- Сложность внедрения. Настройка и интеграция Lexical требуют значительных усилий и глубоких знаний. Это может быть сложным и времязатратным процессом, что особенно критично при ограниченном бюджете.
- Отсутствие некоторых готовых функций. Некоторые привычные и желаемые функции, такие как управление изображениями и таблицами, требуют дополнительной разработки и интеграции.
- Местами слабо документирован. Решили взять Lexical? Приготовьтесь курить документацию, но так или иначе вопросы будут оставаться. По модулям вообще далеко не везде есть нормальная инфа, только API.

Выбирать Lexical или искать альтернативу решать вам, но прежде чем поиграв с ним в Playground радоваться и думать ЭТО ОНО ознакомьтесь с документацией (да, я этот шаг решил упустить 😅) и примерами других проектов на данном фреймворке.

Всем добра и кода без багов! 🫶

📦 NPM
🔗 GitHub

#npm #полезное
2🤩1