React Compiler обещает избавить от ручной мемоизации и вернуть разработчику фокус на логику интерфейса. Но за этой когнитивной разгрузкой скрывается тонкий риск: в ряде случаев компилятор тихо откатывается к обычному поведению React, и вы узнаёте об этом только по деградации UX. В статье — практический разбор «тихих» сбоев, ограничений синтаксиса и способа заставить сборку честно сигнализировать о проблемах через ESLint.
Я до сих пор бомблю от редизайна Duolingo.
Чтобы тренироваться без отвлечения на геймификацию, написал небольшой тренажер грамматики английского языка. Супер простой (vanilla JS + HTML), но со своими особенностями.
Особенности решения — под катом.
Наверное, каждый из нас ловил себя на мысли: что отправить на день рождения в этот раз? Просто текст, тёплую фотографию или голосовое сообщение? И сразу вспоминается это чувство, когда ищешь или обдумываешь креативный текст, а потом вспоминаешь о милой картинке с котиком, гифке с шампанским или стандартном «С ДР!» — и отправляешь, чисто для галочки.
Со временем я заметил: когда получаешь такое поздравление в Telegram, становится немного грустно, что человек хоть и поздравил, но не потратил время на то, чтобы обдумать и искренне пожелать чего-то хорошего и уникального только про тебя. Хотя понимаешь — это нормально. Поколение постарше привыкло обмениваться этими милыми, но безликими посланиями. Хотя не все делают это из-за нежелания — некоторым просто понравилась картинка, вот и скинули.
Привет, Хабр! Меня зовут Сергей, я фронтенд-инженер в Банки.ру.
В этой статье расскажу, как Zod помог нам перестать писать валидацию на уровне полей, подружился с React Hook Form и стал единым источником правды о структуре данных.
К Zod мы пришли не сразу. Долгое время типы и валидация у нас жили в разных слоях приложения: TypeScript определял структуру данных во время разработки, а отдельные функции или библиотеки (вроде Yup) проверяли входящие значения в рантайме.
Это классическая проблема: дублирование логики и рассинхрон. Типы в interface поменялись, а валидация осталась прежней (или наоборот). Мы пробовали Yup, но он казался громоздким в связке с TS: типы приходилось выводить вручную или мириться с тем, что схемы выглядят непрозрачно. В какой-то момент стало непонятно: зачем тащить отдельную библиотеку, если проще написать if (typeof x === 'string')?
С переходом на Zod всё стало значительно проще: одна схема одновременно является и валидатором, и источником типа данных.
Решил один мой коллега (не разработчик) заняться пет-проектом: создать платформу с элементами соцсети и встроенным картографическим плагином. И вот приходит этот коллега ко мне с вопросом по части фронтенда: «А как бы мне отрендерить страницы: на сервере или на клиенте?», описывая то решение, которое он уже сделал и которое в целом работает.
Что ж. Меня зовут Андрей, я фронтенд-разработчик в Selectel. В этой статье я расскажу и покажу, какие виды рендеринга веб-страниц существуют и в каком случае лучше использовать тот или иной подход. Разберем все это дело на примерах. Сперва пройдемся по теоретическим основам, а затем — по практике. Если так сложилось, что и вас жизнь привела к подобным фронтендерным запросам, но должного опыта еще нет, добро пожаловать под кат.
📉🐻 Как ИИ получил руки для торговли на бирже
Claude Code уже разбирается в техническом анализе, умеет искать в интернете для фундаментального, может быть запущен удаленно на сервере с iPad через Claude Code on the web, умеет анализировать файлы логов сам программируя python скрипты.
Осталось ли собрать всё это в кучу...
Как я сделал приложение для обхода Discord и YouTube на macOS (и Windows тоже)
TL;DR: Написал open-source десктопное приложение UnblockPro на Electron, которое в один клик обходит DPI-блокировки Discord, YouTube и других сервисов. Работает на macOS и Windows. Без VPN, без серверов, без абонентки. Код на GitHub — by-sonic/unblock-pro.
Зачем вообще это было нужно
С осени 2024 года ситуация с доступом к Discord и YouTube в России стала, мягко говоря, непростой. VPN — вариант, но:
Платные сервисы стоят денег и сливают скорость
Бесплатные — сливают данные
Не все работают стабильно
Настраивать VPN для каждого устройства — боль
Привет, Хабр! (И тебе, 1С-ник, который привык к «желтой» программке, и тебе, веб-разработчик, который до сих пор думает, что 1С - это только про накладные и бухгалтеров.)
В прошлой серии мы выяснили, что «1С:Предприятие.Элемент» - это не та «желтая программа», к которой привыкли бухгалтеры, а вполне себе модный cloud-native зверь с IDE в браузере. Но слова - это дешево. Разработчику нужно видеть код, архитектуру и понимать, как это соотносится с тем, что он уже знает (будь то 1C, Python или JavaScript).
Сегодня мы лезем под капот. Мы разберем синтаксис, систему типов, декларативный UI и узнаем, как 1С реализовала ORM, который (спойлер) удобнее многого, что вы знали, но не без своих 1С-овских замашек.
Поехали.
Когда заходит разговор про WebAssembly, где-нибудь в начале дискуссии обычно появляется комментарий в духе «А что, собственно, произошло?»
Этот язык преподносили как нечто поворотное. Неужели это просто был яркий маркетинг? А может, очередной случай с обречённым на провал апплетом JVM?
И я хочу подойти к этой теме немного со стороны, так как подобные вопросы содержат ошибочные предположения, которые следует прояснить.
Здравствуйте, коллеги программисты!
Большинство фейлов в CI — это мелочи: забытый console.log, форматирование, линт, сломанный импорт, файл без теста. Такие ошибки не должны доезжать до сборки или код-ревью.
Git-хуки позволяют запускать проверки прямо во время git commit и блокировать коммит, если были обнаружены нарушения.
В прошлой статье я рассказывал про скрипты, которые я использую для проверки качества кода в PHP/Laravel.
В этой статье я хочу рассказать о скриптах для JavaScript/TypeScript и Python — линтинг, форматирование, тесты, статический анализ и проверка наличия тестов.
Все скрипты, описанные в статье, находятся здесь.
Начиная с этого месяца мы ежемесячно будем знакомить вас с доработками в плагинах GigaIDE — как в Community-версии, так и в PRO. Если кто-то пропустил, в декабре мы уже делали краткий обзор текущей линейки функциональности, когда рассказывали про наш маркетплейс.
Итак, начнём!
В статье реализуется собственный Promise в JavaScript. Разбираем базовую модель промисов, проблемы наивной реализации и то, как они решаются в спецификациях Promises/A+ и ECMAScript.
Материал предназначен для разработчиков, которые используют Promise и хотят понять, как он работает внутри.
Привет!
Это третий выпуск Frontend Status — дайджеста по фронтенд-разработке.
В этом выпуске — 30+ ссылок: разбираем, почему Angular живёт в банках и корпорациях, AGENTS.md vs skills в Next.js. Плюс CSS, который заменяет десятки строк JS, React Compiler от А до Я, Vue-слоты и Regle, вайбкодинг-исповедь «я сдался», WebGL-галерея на GSAP + Three.js, и ещё много всего интересного!
Привет, меня зовут Саша, и я продолжаю рассказывать о JavaScript тем, кто только взялся за освоение этого языка. В разработке нам постоянно нужны «умные», самостоятельные функции: счетчики, которые знают свое предыдущее значение, обработчики событий с индивидуальными настройками, механизмы для защиты данных.
Чтобы не городить глобальные переменные и не писать громоздкие конструкции (что почти всегда ведет к багам), мы посмотрим на еще одну фишку JS.
В предыдущих статьях мы разобрали: функции, их стрелочные записи, методы объектов и даже покорили this. Теперь пора переходить к теме, которая часто пугает на собеседованиях, но на деле оказывается невероятно элегантной — замыканиям.
Бывало такое: смотрите вы на красивую страницу интернет-магазина, открываете консоль разработчика (ту самую, по F12 или через правый клик), а там — лес из тегов, который вообще не похож на то, что вы видите глазами?
Привет, Хабр! Меня зовут Александр Дудукало, я автор курса по JavaScript. В этой статье мы продолжаем знакомиться с элементами страницы, а именно с DOM. Эти знания вам точно понадобятся в работе с любым проектом. Давайте же больше узнаем, что это за дерево и как с ним работать. Поехали.
В 2026 году обновят JavaScript. Окончательный список изменений сформируется из проектов ECMAScript, достигших 4 этапа к марту. Но многие из них уже на заключительной стадии, а другие готовы и доступны в некоторых браузерах и средах. Под катом — что ждёт разработчиков и какие проблемы будут решены в этом апдейте.
Всем привет!
Долго я возился с маркдауном в своих проектах и, честно говоря, знатно подгорел. Первая проблема — это вечный выбор библиотеки.
С одной стороны, есть «конструкторы» типа unified, remark и rehype. Штуки мощные, но настраивать весь этот AST-конвейер и систему плагинов — это какой-то оверхед и лишняя сложность, имхо.
С другой стороны, есть @next/mdx, который вроде и ок, но слишком завязан на страницах и вообще не умеет работать на клиенте.
Раньше я обычно выбирал что-то вроде markdown-to-jsx или react-markdown.
DX у них приятнее, работают и на клиенте, и на сервере, весят мало.
Но вот беда: они «из коробки» не переваривают HTML или MDX, и ты снова вязнешь в настройке плагинов. А если добавить туда i18n (типа i18next или next-intl), начинается настоящий ад. Куча if/else в коде, чтобы отрендерить нужный язык, и бандл раздувается до небес. Плюс вечные косяки с front-matter. Ну и до недавнего времени всё это было только для React.
В общем, решил я написать свое решение для intlayer. Чтобы просто работало.
> К слову, за основу я взял форк markdown-to-jsx v7.7.14 (от quantizor), который базируется на simple-markdown v0.2.2 (от Khan Academy).
Когда пилил этот парсер, ставил перед собой такие цели:
- Максимально легкий вес
- Кросс-фреймворковость (React, Vue, Svelte, Angular, Solid, Preact)
- Простая настройка: никаких бесконечных цепочек плагинов
- Поддержка SSR и клиентского рендеринга
- Настройка на уровне провайдера: можно легко прокинуть свои компоненты из дизайн-системы
- Компонентный подход: полный контроль над рендерингом каждой части приложения
Недостаток знаний часто подталкивает людей к чрезмерно сложным решениям, и рано или поздно это отражается на производительности.
Возьмем content-visibility: auto. Он дает тот же эффект, что и React-Window, но без единой строчки JS и без увеличения размера сборки. Аналогичная ситуация с современными единицами высоты окна (dvh, svh, lvh): наконец-то приведена в порядок "мобильная" высота, которую годами пытались компенсировать через window.innerHeight.
Обе технологии в 2024 году получили более 90% поддержки современных браузеров и полностью готовы для продакшна. Однако мы по привычке продолжаем решать такие задачи с помощью JS, просто потому, что CSS незаметно ушел вперед, пока мы спорили о React Server Components.
Мне кажется, я знаю, как должен быть устроен идеальный электродвигатель, но чтобы это доказать, нужен инструмент. Существующий софт убивал все желание: медленно, дорого или неудобно.
За зимние каникулы мы с Gemini (да, почти весь код написал ИИ) создали свой солвер на WebGPU. Весь софт - это один HTML-файл. Он работает в браузере, считает сетки до 16К в реальном времени и умеет то, чего нет у аналогов.
Привет, Хабр! (И тебе, случайный читатель, который думает, что "код - это магия", а процессор - маленький гномик, который внутри ноутбука читает for i in range(10) и послушно бегает кругами.)
Сегодня разберёмся с вопросом, который в какой-то момент приходит в голову каждому разработчику, а потом быстро вытесняется дедлайном:
Как вообще компьютер “читает” Python или 1С или любой другой язык программирования, если он понимает только 0 и 1? И почему ваш идеальный код иногда превращается в "segmentation fault" / "Неопределённая ошибка" / “Пользователь не найден (хотя он сидит напротив)”?
Вот и мне спустя годы в разработке пришла идея изучить этот ваш старомодный Computer Science и понять вообще, что такое программа и компьютер на самом деле.
Поехали. Будет без хардкора уровня “компилятор за 21 день”, но с понятными аналогиями, для статьи упростил всё до минимума. Реально постарался переварить информацию и выдать её в красивой упаковке. Кстати, в статье будут примеры из двух разных миров Python и 1С, так что будет интересно…
