babel

  • ХабрахабрФото В поисках лучшей версии EcmaScript для сборки

    В поисках лучшей версии EcmaScript для сборки

    Как оказалось, выбор версии ES для сборки веб-приложения, а также организация самой этой сборки, может оказаться весьма сложной задачей. Особенно, если вы собираетесь делать этот выбор, основываясь исключительно на доказательной базе. В этой статье я постараюсь ответить на следующие вопросы, возникшие в ходе моего расследования на эту тему: Как влияет компиляция кода под ES5 на производительность сайта? Какой инструмент генерирует…

    Читать далее »
  • ХабрахабрФото Как я Jest с помощью SWC ускорял

    Как я Jest с помощью SWC ускорял

    За последние пару лет не раз можно было услышать про новые инструменты сборки статики, такие как SWC, esbuild и Vite. Все они обещают нам next gen-оптимизацию времени сборки, а SWC ещë и грозится оптимизировать скорость выполнения тестов на Jest; более того, судя по документации, сделать это очень просто. Я решил проверить, так ли это на самом деле и каким будет…

    Читать далее »
  • ХабрахабрФото Что не так с сорсмапами и как с ними не связываться?

    Что не так с сорсмапами и как с ними не связываться?

    Здравствуйте, меня зовут Дмитрий Карловский и у меня… посттравматическое стрессовое расстройство после генерации сорсмапов. И сегодня, с вашей помощью, мы будем это лечить путём максимально глубокого погружения в травмирующие события. Это — текстовая расшифровка выступления на HolyJS'21. Вы можете посмотреть видео запись, прочитать как статью, либо открыть в интерфейсе проведения презентаций. Как я до этого докатился? Сперва история болезни: Однажды…

    Читать далее »
  • ХабрахабрФото Минифицируем приватные поля в TypeScript. Доклад Яндекса

    Минифицируем приватные поля в TypeScript. Доклад Яндекса

    Меня зовут Лёша Гусев, я работаю в команде разработки видеоплеера Яндекса. Если вы когда-нибудь смотрели фильмы или трансляции на сервисах Яндекса, то использовали именно наш плеер. Я сделал небольшую оптимизацию размера бандла — минификацию приватных полей. В докладе на Я.Субботнике я рассказал об использовании Babel-плагинов, трансформеров TypeScript и о том, насколько в итоге уменьшился размер продакшен-сборки проекта. [embedded content] Конспект…

    Читать далее »
  • ХабрахабрФото [Перевод] Пишем babel плагин, пошаговое руководство

    [Перевод] Пишем babel плагин, пошаговое руководство

    Сегодня я поделюсь с вами пошаговым руководством как написать свой babel плагин. Вы сможете использовать эти знания для автоматизации правок, рефакторинга или кодогенерации. Что такое babel? Babel это JavaScript компилятор, который в основном используют для конвертации кода на ECMAScript 2015+ в обратно совместимый с текущими и более старыми браузерами или окружениями. Babel использует систему плагинов для преобразования кода, поэтому кто…

    Читать далее »
  • ХабрахабрФото [Перевод] JavaScript tree shaking, like a pro

    [Перевод] JavaScript tree shaking, like a pro

    Это перевод статьи об оптимизации и уменьшении размера бандла приложения. Она хороша тем, что тут описаны best practices, советы, которых стоит придерживаться, чтобы тришейкинг работал и выкидывал неиспользуемый код из сборки. Она будет полезной многим, потому что сейчас все используют системы сборки, в которых «из коробки» есть тришейкинг. Но чтобы он работал правильно, нужно придерживаться принципов, описанных ниже. Тришейкинг становится…

    Читать далее »
  • СофтФото [Перевод] Опрос по инструментам фронтенда 2019 — результаты

    [Перевод] Опрос по инструментам фронтенда 2019 — результаты

    TL;DR. В большинстве категорий теперь выделяются явные лидеры — несколько лет назад такого не было. Это помогает накоплению знаний. Поэтому Навыки владения инструментами в среднем становятся глубже у разработчиков всех уровней. Как всегда, огромная благодарность всем, кто нашёл время заполнить опросник. В этом году 3005 разработчиков ответили на 27 вопросов, охватывающих широкий спектр инструментов и методологий фронтенд-разработки. Со своей стороны,…

    Читать далее »
  • ХабрахабрФото [Перевод] Создание собственных синтаксических конструкций для JavaScript с использованием Babel. Часть 2

    [Перевод] Создание собственных синтаксических конструкций для JavaScript с использованием Babel. Часть 2

    Сегодня мы публикуем вторую часть перевода материала о расширении синтаксиса JavaScript с использованием Babel. → Головокружительная первая часть Как работает парсинг Парсер получает список токенов от системы токенизации кода и, по одному рассматривая токены, строит AST. Для того чтобы принять решение о том, как именно использовать токены, и понять, какой токен можно ожидать следующим, парсер обращается к спецификации грамматики языка.…

    Читать далее »
  • ХабрахабрФото [Перевод] Создание собственных синтаксических конструкций для JavaScript с использованием Babel. Часть 1

    [Перевод] Создание собственных синтаксических конструкций для JavaScript с использованием Babel. Часть 1

    Сегодня мы публикуем первую часть перевода материала, который посвящён созданию собственных синтаксических конструкций для JavaScript с использованием Babel. Обзор Для начала давайте взглянем на то, чего мы добьёмся, добравшись до конца этого материала: // конструкция '@@' оснащает функцию `foo` возможностями каррирования function @@ foo(a, b, c) { return a + b + c; } console.log(foo(1, 2)(3)); // 6 Мы собираемся…

    Читать далее »
  • ХабрахабрФото [Перевод] Зачем современную веб-разработку так усложнили? Часть 1

    [Перевод] Зачем современную веб-разработку так усложнили? Часть 1

    Современная фронтенд-разработка оставляет полярные впечатления: одни её любят, другие презирают. Я большой поклонник современной веб-разработки, хотя мне она напоминает некую «магию», со своими плюсами и минусами: Когда вы поймете, как использовать волшебные инструменты (babel! бандлеры! вотчеры! и так далее!), ваш рабочий процесс становится быстрым, мощным и восхитительным Если вы не понимаете волшебные инструменты, всё ужасно запутанно …и попытки освоить магию…

    Читать далее »


Кнопка «Наверх»