Я бросил себе вызов: симулировать 1000000 (миллион) частиц на чистом Javascript на телефоне, используя только CPU и добившись 60 FPS.Поехали.Задача не особо сложна, если выполнять всю работу на GPU, но правило гласит, что нужно пользоваться только CPU, при этом работая на JS, так что никакого WASM.Я знаю, о чём вы подумали: это не особо сложно, достаточно создать массив и засунуть в него миллион объектов.Возможно, что-то типа такого?const count = 1_000_000; const particles = new Array(count).fi…
Всем привет! Я Сергей, фронтенд-разработчик из команды привлечения Центрального университета. Занимаюсь проектами, связанными с регистрацией абитуриентов на мероприятия, и внутренними проектами по управлению мероприятиями. Осенью мы ждем поступление бакалавров. Чтобы начать набор, нужно встроить форму регистрации в лендинг на CMS. Форма довольно простая: пара полей для ввода данных, диалоговое окно с текстом соглашения об обработке персональных данных и кнопка отправки данных на сервер. Для ско…
Edge рантайм. Один из главных функционалов компании Vercel — компании, которая разработала и развивает next.js. Тем не менее, её влияние по edge рантайму вышло далеко за рамки её фреймворков и утилит. Edge рантайм работает и в недавно купленном Vercel Svelte, и в nuxt, и в более чем 30 других фронтенд фреймворках. Эта статья будет посвящена edge рантайму — что это, как это используется в Vercel, какими возможностями дополняет next.js и какие решения сделал я, чтобы эти возможности расширить.Ver…
Привет, друзья! В этой серии статей мы продолжаем разбирать структуры данных и алгоритмы, представленные в этом замечательном репозитории. Это вторая часть серии. Первая часть Сегодня мы будем говорить о таких структурах данных, как хэш-таблица, куча, очередь с приоритетом и префиксное дерево. Код, представленный в этой и других статьях серии, можно найти в этом репозитории. Интересно? Тогда прошу под кат. 5. Хэш-таблица Описание Википедия YouTube Хэш-таблица (hash table) — это структура …
Edge рантайм. Один из главных функционалов компании Vercel - компании, которая разработала и развивает next.js. Тем не менее, её влияние по edge рантайму вышло далеко за рамки её фреймворков и утилит. Edge рантайм работает и в недавно купленном Vercel Svelte, и в nuxt, и в более чем 30 других фронтенд фреймворках. Эта статья будет посвящена edge рантайму - что это, как это используется в Vercel, какими возможностями дополняет next.js и какие решения сделал я, чтобы эти возможности расширить.Ver…
Недавно команда Microsoft Edge написала статью о том, как они улучшают Edge, чтобы браузер стал быстрее. В материале Microsoft сделала выпад в сторону React и объявила, что больше не будет использовать React для Edge.React произвел революцию в создании веб-приложений, продвигая многократно используемые компоненты, оптимизируя производительность с помощью виртуального DOM, упрощая управление состоянием и рендеринг пользовательского интерфейса.Что такое React (с примером кода)React — это JavaScri…
АннотацияСтатья о том: как мне пришла в голову идея создать настольное приложение на electron и node.js для отображения картин известных художников как обои рабочего стола; с какими трудностями столкнулся; как решал процесс сборки приложения на node.js для конечного пользователя.ВведениеВ прошлом году я подписался на одно сообщество во ВК, суть его была в том, что он выкладывал каждый день посты, которые содержали 2 единственные вещи: изображение какой-либо академической картины и краткая инфор…
Все фронтендеры любят localStorage — ведь в него можно прикопать данные без всяких баз и серверов. Но из localStorage можно отлично обстрелять себе ногу — сегодня расскажу про 6 встроенных пулеметов:Коллизии ключейИзменение схемы данныхРассинхрон схемы на чтение и на записьОшибки setItemЧтение localStorage в SSRОтсутствие изоляции между пользователямиМне надоело бояться и подпирать эти проблемы в каждом проекте, и я создал библиотеку banditstash, которая нежно, но настойчиво защищает вас от эти…
В этой серии статей мы отправимся в путешествие по миру пользовательских хуков React, открывая для себя их огромный потенциал для улучшения ваших проектов. Сегодня мы сосредоточимся на хуке useRenderCount, одном из многих тщательно разработанных хуков, доступных в коллекции пользовательских хуков React. Github: https://github.com/sergeyleschev/react-custom-hooks import { useEffect, useRef } from "react" export default function useRenderCount() { const count = useRef(1) useEffect(…