Рубрика «фронтенд»

Привет! Меня зовут Вася Пикулев, я руковожу кор-командой веб- и Smart TV-клиентов в Окко. Стандарт WebMCP может изменить мою работу в ближайшие годы. И я хочу попробовать вместе с вами разобраться, что он нам несёт и какие открывает перспективы.


Представьте: один и тот же сайт. Один и тот же запрос пользователя к ИИ-агенту — подписаться на рассылку. Два способа выполнить.

Способ первый, сегодняшний.Читать полностью »

Разработка фронтенда интернет-магазина через Qwen 3.6 Plus и Qwen ClI - 1

Привет всем.

Расскажу про свой личный опыт разработки через Qwen 3.6 Plus и Qwen ClI. И да, статья полностью написана человеком.

Читать полностью »

Как всё началось

В августе 2024 я наткнулся на проблему в рабочем проекте на Next.js. Несколько страниц импортировали константы из общего файла через barrel (index.ts с реэкспортами). Каждая страница использовала 2-3 значения, но в бандл попадало всё — десятки неиспользуемых экспортов. Разница оказалась колоссальной: когда я добавил sideEffects: false и перешёл на direct export — бандл уменьшился в два раза.

Я завёл issue на GitHubЧитать полностью »

Вместо предисловия: проблема, которая бесила меня годами

У каждого из нас есть «чёрная дыра», куда уходят полезные ссылки. Кто-то сохраняет их в «Избранном» браузера, кто-то пишет сам себе в Telegram, кто-то держит десяток вкладок открытыми «на потом». У меня была та же проблема. Я пробовал Notion, Evernote, Google Keep, Obsidian - всё это мощные инструменты, но для простого «сохранить ссылку и не забыть» они часто избыточны.

Так родилась идея KylikLink - минималистичного PWA-приложения для заметок и ссылок, которое работает без интернета и не требует регистрации.

Почему KylikLink?

Название составное: KylikЧитать полностью »

Когда говорят «React перерендерился» — обычно имеют в виду что-то расплывчатое. Новичкам это слово объясняет всё и ничего одновременно. В официальной документации процесс описан точнее: trigger → render → commit. Давайте разберём, что происходит на каждом этапе — без магии, зато с Fiber, флагами и браузерным пайплайном.


Render-фаза: вычисление изменений

Render-фаза — это не обновление DOM. Это вычисление того, каким DOM должен стать.

React рекурсивно обходит дерево компонентов, вызывает их функции (или render()Читать полностью »

Цена одной строчки

const data = await fetch('/api/dashboard').then(r => r.json());

Безобидная строчка. Одна из миллиардов, написанных сегодня на планете. Студент с курса напишет её на третий день. Сеньор – с закрытыми глазами.

Но знаете ли вы, что эта строчка стоит? Не абстрактно – «ну, это сетевой вызов». А конкретно: в байтах, миллисекундах, рублях и часах дежурства инженера в три часа ночи по Москве.

Давайте разберём один fetch на атомы. Снимем слои абстракций и посмотрим, что на самом деле скрывается за фасадом «просто сетевого вызова».


Запрос уходит

Читать полностью »

Цена одной строчки

const data = await fetch('/api/dashboard').then(r => r.json());

Безобидная строчка. Одна из миллиардов, написанных сегодня на планете. Студент с курса напишет её на третий день. Сеньор – с закрытыми глазами.

Но знаете ли вы, что эта строчка стоит? Не абстрактно – «ну, это сетевой вызов». А конкретно: в байтах, миллисекундах, рублях и часах дежурства инженера в три часа ночи по Москве.

Давайте разберём один fetch на атомы. Снимем слои абстракций и посмотрим, что на самом деле скрывается за фасадом «просто сетевого вызова».


Запрос уходит

Читать полностью »

Привет!

Меня зовут Виктор, и я хочу рассказать, как бытовая рабочая задача привела меня к тому, что я написал полноценный аудиоредактор, который работает целиком в браузере - без единого запроса на сервер. Под капотом - Web Audio API, OfflineAudioContext, порт LAME-энкодера на JavaScript и немного стыдных архитектурных решений, о которых тоже расскажу.

Как всё началось

Читать полностью »

Компилируем TypeScript в натив: хардкор и мясо - 1

Зачем вообще компилировать TypeScript?

Читать полностью »


https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js