"JS беспредел"

В главной роли - Деми Мурыч

#js #video #murych #vuefaqpictures

О-очень интересная картинка о динамике развития различных библиотек и фреймворков со State of JS

Интерактивная версия

Хотя релевантность выборки для составления статистики под большим вопросом. Как помнится, по этим опросам неудовлетворенных пользователей Vue у них получилось больше, чем неудовлетворенных пользователей React

#js

0 == "0"
// true

0 == []
// true

"0" == []
// false

Волшебство JavaScript

#js

Красивые симуляции на JavaScript с целью изучения его возможностей по производительности

Статья

#js #performance

const count = ?;

let x = count;
let y = count;

x++;
console.log(x);

y = y + 1;
console.log(y);

Немного JavaScript

В каких случаях результат вывода будет различным?

#js #challenge

JavaScript worker threads / Web workers — это мощный функционал, доступный в современных веб-браузерах, а также в Node.js, Deno и Bun, который позволяет создавать независимые потоки выполнения в одной JavaScript-среде. Эти worker threads работают параллельно с главным потоком, позволяя приложению выполнять ресурсоемкие операции или обрабатывать сетевые запросы без блокировки пользовательского интерфейса.

Преимущества использования worker threads:

Повышенная отзывчивость: Передавая длительные задачи на worker threads, главный поток остается свободным для обработки пользовательских взаимодействий и обновления интерфейса. Это приводит к более плавному и отзывчивому пользовательскому опыту.

Повышенная производительность: Worker threads могут использовать несколько ядер современных процессоров, что позволяет параллельно выполнять ресурсоемкие задачи.

Эффективный обмен данными: В отличие от дочерних процессов, worker threads совместно используют память с главным потоком. Это позволяет эффективно передавать большие структуры данных между потоками, снижая необходимость дорогостоящей сериализации и десериализации.

Модульный код: Worker threads способствуют модульной организации кода. Мы можем изолировать сложные задачи в отдельных worker-скриптах, улучшая поддержку и повторное использование кода.

Варианты использования:

1. Ресурсоемкие вычисления

Представьте, что у нас есть сложная математическая формула для расчета данных по нескольким точкам. Непосредственное выполнение этого на главном потоке заблокирует пользовательский интерфейс и сделает наше веб-приложение неотзывчивым. Такие задачи идеально подходят для worker threads.

2. Обработка изображений/видео

Допустим, мы хотим разрешить пользователям загружать изображения в наше веб-приложение и применять фильтр черно-белого цвета перед отображением. Обработка изображения непосредственно в главном потоке может вызвать задержку во время применения фильтра. Опять же, это ресурсоемкая задача, где worker threads могут спасти ситуацию.

3. Анализ данных

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

4. Фоновые задачи

Представьте, что у нас есть веб-приложение, позволяющее пользователям сохранять свою работу в процессе. Постоянное сохранение данных на сервере во время редактирования может быть неэффективным и потенциально замедлить пользовательский интерфейс. Worker thread можно использовать для обработки фоновой функции сохранения.

5. Приложения в реальном времени

Приложения в реальном времени требуют постоянного общения с сервером для обновления пользовательского интерфейса последней информацией. Worker threads могут быть полезны для управления этими соединениями и обработки входящих данных без блокировки главного потока, ответственного за отрисовку пользовательского интерфейса.

#js #workerthreads

В третьей стадии находится пропозал о декораторах в JavaScript

Если его примут, задание реактивных переменных возможно "упростится" до:

@reactive
let count = 0;

@shallowReactive
let messages = [];

Правда, после этого js перестанет быть js-ом...

#js #tc39 #decorators

Интересный сайт, рассказывающий как писать современные веб приложения на чистом JS, CSS и HTML

plainvanillaweb.com

#js #webcomponents