JavaScript *

Сегодня я хотел бы рассказать о Rematch — библиотеке, которая предоставляет удобный и эффективный способ управления состоянием ваших веб-приложений. Если вы уже знакомы с Redux и ищете более простое и компактное решение, то Rematch может оказаться для вас полезным инструментом. 

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

Rematch предлагает удобный синтаксис и позволяет избежать написания многочисленных бойлерплейтов, свойственных Redux. С помощью него вы можете быстро создавать и организовывать Redux-хранилище, экономя при этом время и упрощая процесс разработки. Rematch идеально подходит для различных типов проектов, независимо от их размера и сложности.

С помощью Rematch вы можете определить модели (models) и их состояние, эффекты (effects) и редьюсеры (reducers). Он предоставляет удобные инструменты для работы с асинхронными операциями, а также возможность создания селекторов (selectors) для выборки данных из хранилища. Все это помогает организовать логику вашего приложения и управлять его состоянием с минимальными усилиями.

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

Привет, Хабр! Меня зовут Владимир Захаров (@‌vzkhrv), я расскажу про SSR. На самом деле, утечки памяти работают в JavaScript везде – и на сервер-сайте, и на клиенте, поэтому информация будет полезна даже тем, у кого пока нет SSR. Давайте чуть подробнее познакомимся. Я ведущий фронтэнд-разработчик, около 8 лет в отрасли. В Зарплате.ру больше не работаю, но основной опыт, о котором хочу рассказать, получен именно там. Я люблю плавающие баги, разговоры о техдолге и шутки про ненастоящих программистов. Поговорим про утечки в памяти в SSR, про работу с памятью и про то, как всё это выглядит в браузере и в nodejs. Ну, и естественно, как со всем этим жить.

C 2018 года карта веб-версии 2ГИС рендерится при помощи WebGL — API для рисования трехмерной графики. Сначала мы в команде веб-карт использовали эту технологию просто как очень быструю рисовалку двухмерных данных с небольшими исключениями в виде 3D-домов и моделей.

Приход в карту иммерсивных возможностей начал менять сложившееся положение вещей — моделей стало больше, они стали красивее и детальнее, их больше хочется рассматривать.

Что ожидается в статье:

Три новые функции CSS позволяют легко добавлять плавные анимации появления и исчезновения.

Вычисление наборов данных более высокого порядка с помощью группировки массивов.

DevTools упрощает процесс локальных переопределений.

И многое другое.

Современные устройства и браузеры развиваются достаточно быстро, но все-равно этого бывает недостаточно для задач со сложными вычислениями. К таким задачам можно отнести обработку видео.

Одной из задач, где мы в Ozon используем Canvas, является обработка видео. Для это у нас реализован минималистичный видеоредактор. Зачем нужно было делать свой редактор для веба и почему не использовать готовый? Все ответы под катом.

Kysely.js – это библиотека, позволяющая писать типизированные SQL запросы. Библиотека делает работу с SQL в вашем проекте более безопасной, избавляя от таких ошибок как опечатки в названиях колонок или таблиц и неправильное использование SQL операторов в коде (код не скомпилируется). Ко всему прочему она делает работу с SQL более удобной, предоставляя при написании запросов автодополнения для таблиц, колонок, алиасов и других сущностей. Kysely имеет незначительный слой абстракции над SQL для того чтобы можно было пользоваться всей мощью SQL и при этом не изучать множество дополнительных сущностей. Библиотека поддерживает MySQL, PostgreSQL, SQLite, PlanetScale, D3, SurrealDB и другие.

Теперь погрузимся в наш кисель ?.

Несколько дней назад, чтобы доказать что в интернете кто‑то не прав, мне пришлось «считать пиксели», чтобы оценить соотношение размеров двух предметов на фото. Тогда еще я не сообразил сразу, что можно было просто загуглить что‑нибудь вроде «Pixel ruler» и получить размер предметов в пикселях, из которого легко можно получить соотношение. Я же взял подручный MS Paint, вырезал один предмет и уместил его несколько раз внутри другого предмета, сразу узнав во сколько раз один больше другого. Но мне вдруг стало интересно немного автоматизировать этот процесс и решил написать пиксельную рулетку сам, такую что вводишь заранее уже известный тебе размер некоторого предмета, указываешь его на фото в виде линии, и потом уже другие линии автоматом пересчитываются по отношению к этому размеру. Получилось что‑то в этом роде:

В этой статье я расскажу, как постепенно разбирал этот непонятный .zmbx, про устройство и преимущества glTF как формата передачи 3D-ассетов между разными инструментами, и про то, какие проблемы я решал, конвертируя одно в другое.

При проектировании часто приходится работать с чертежами выполненными другими людьми и, разумеется, они наделяют объекты теми цветами которые сочтут нужными. Цвета эти не всегда "по слою" и часть из них находится внутри блоков вложенных друг в друга произвольным образом. Нужен простой и быстрый способ сократить палитру чтобы не тратить лишнее время на подготовку чертежа к работе. Свой способ решения этой задачи я и хочу представить в этой статье.

Поскольку не все пользователи Нанокада дружат с программированием, в конце приведу простую инструкцию позволяющую применить всё нижеописанное без понимания js, а те кто с программированием знаком, полагаю, уже поняли что задача решается простейшим скриптом на пару десятков строк.

Привет, меня зовут Денис, я руковожу направлением разработки в Домклик. Дополнительно несу ношу лидера frontend-направления в нашей компании. Не так давно я отрефакторил систему собеседований для frontend-разработчиков, попутно тестируя технические вопросы на внешних и внутренних респондентах. И пришёл к выводу, что множество мной опрошенных разработчиков, вне зависимости от уровня, не знают или просто не обращают внимание на базовые правила при работе с картинками. В результате на просторах интернета зачастую можно найти изображения размером 200 на 200 пикселей и весом в несколько мегабайтов со смещением макета, столь раздражающим пользователей. Если вам интересно, как практически без вложений улучшить пользовательский опыт, то прошу под кат.

Серверные компоненты React – это большой кусок работы. Недавно мы переосмыслили нашу документацию и устроили ребрендинг Mux. Пока мы этим занимались, мы перенесли весь материал сайтов mux.com и docs.mux.com на серверные компоненты. Так что, поверьте мне… я знаю. Знаю, что это возможно, не так страшно и, в принципе, что дело того стоит.

Давайте я вам объясню, почему, ответив на следующие вопросы: почему так важны серверные компоненты, а также для чего они хороши? Для чего они не так хороши? Как их использовать, как их постепенно внедрять и какие продвинутые паттерны следует использовать, чтобы всем этим управлять? Дочитав эту статью, вы станете замечательно представлять, следует ли вам использовать серверные компоненты React, а если следует – то как использовать их эффективно.

Видео от автора на ту же тему.

Представляем Bun версии 1.0.

Bun — это быстрый и универсальный набор инструментов для запуска, сборки, тестирования и отладки JavaScript и TypeScript кода (от одного файла до fullstack-приложения). Сегодня Bun стабилен и готов к продакшену.

Привет, Хабр! Я участвую в разработке крупного Web приложения и мы с коллегами на этапе проработки и планирования архитектуры пришли к выводу о необходимости выносить всю логику приложения в отдельный поток Web Worker, т.к. предполагается большое число фоновых операций и вычислений. К чему это привело? Сложности? Пути их решения? Обо всем попорядку.

По общему мнению, TypeScript стал большим успехом для Microsoft. Я видел множество сияющих от радости людей, напичкавших JavaScript типами, которые могут быть проверены компилятором. Но я никогда не был его поклонником. Ни через пять минут размышлений, ни через пять лет. Поэтому я с большим удовольствием могу сообщить, что мы отказываемся от TypeScript в следующем большом выпуске Turbo 8.

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

Чтобы исправить ситуацию, нужно собрать мощный, оптимизированный, а главное, реюзабельный ESLint.

Это статья написана на основе доклада Дениса Красновского для FronendConf 2022. Денис, руководитель направления разработки и фронтэнд-лид в компании Домклик.

Приложение, о котором пойдёт речь, применимо в архитектурно-строительной области. С развитием информационных технологий, технологий строительства и производства, а также экономической составляющей, появилась необходимость в более эффективном и комплексном подходах в управлении инвестиционно-строительными проектами, что поспособствовало появлению и формированию ТИМ BIM-технологии.

С тенденцией перехода сервисов в облачные решения, начали появляться open-source библиотеки или бесплатные программы по работе с BIM-моделями в web, такие, как xeokit, IFC++, IfcOpenShell и др., а соответственно и BIM-стартапы, преследующие цели OpenBIM или закрывающие конкретные задачи.

IFC.js — это библиотека JavaScript для работы с моделями IFC формата в браузере.

Библиотека storage-facade, о которой пойдет речь в этой статье, предоставляет единый синхронный / асинхронный API хранилища, являющийся абстракцией над реальной реализацией хранилища. Для конечного пользователя она упрощается использование любых хранилищ, для которых абстрактный класс из storage-facade будет реализован. Как автор этой библиотеки, расскажу о её использовании.

Есть реализации для IndexedDB, localStorage, sessionStorage, обёртка для Map.

Рассмотрим самый простой вариант, storage-facade-localstoragethin.