Популярные гиды, как Youmightnotneedjquery.com. и Вам не нужен Лоташ/подчеркивание оспаривали обычную отраслевую практику.
Этот пост не так дикий, как, скажем, Youmightnotneedjs.com. , но он уточняет транспитацию и объясняет, почему он не может быть при необходимости в ближайшем будущем.
Statcounter собирает данные о 15 миллиардах просмотров страниц каждый месяц с 2,5 миллионов сайтов по всему миру Отказ По состоянию на май 2017 года это статус-кво:
То, что делает эту диаграмму интересной, состоит в том, что топ-3 браузеры (Chrome, Safari и Firefox) являются вечнозеленый С Что означает 74% пользователей, автоматически получают последнюю версию своего браузера.
Давайте посмотрим, правильно ли это предположение.
Вот лучшие версии браузера на рынке:
Chrome 58 был выпущен Менее месяца назад и его настольная версия проводит 12,77% мировой доли рынка браузера. Chrome 57 был выпущен всего за 42 дня до этого, и его версия на рабочем столе удерживается 9,96% мирового рынка браузера. К сожалению, statCounter не отличается дифференцируемыми версиями Chrome на мобильных платформах, но предполагая то же отношение, что и настольный компьютер, мы в конечном итоге
Что это значит для моего кода?
По словам Таблица совместимости ES Последняя версия всех основных браузеров имеет очень хорошую поддержку функций ES6:
Другими словами, если вы транспилируете JavaScript на ES5, вы делаете свой код излишне большим и медленно поддерживать меньшинство пользователей, которые, вероятно, будут обновлять свою систему к тому времени, когда вам удастся настроить свой веб-пакет и Babel! ?
Почему вы все еще транпили?
Вы все еще можете захотеть транспортировать свой код, но, надеюсь, после взвешивания минусов и за исключением или возможных альтернатив:
- Вы используете React JSX (который довольно популярен в данный момент Поэтому я предполагаю, что многие разработчики вписываются в эту категорию). Jsx в его ядре это Преобразование XHTML к коду JS и не нужен нужен полный транспортировщик, как Бабел. Кроме того, если все, что вам нужно, это Виртуалия Используйте это вместо этого.
- Вы хотите попробовать последние функции языка. Если вы не являетесь частью TC39 или не имеете горение желания вводить нестабильные языковые функции в ваш производственный код, вы, вероятно, в порядке с ES6. В наши дни у нас есть достойный язык – это большинство браузеров, и необходимость транпила исчезает.
- Вы используете TeampScript и надеюсь взвешил минусы и плюсы Отказ TyplectScript Compiler, при нацелении на современную версию ES6, в основном разделяет информацию о типах, а не трансформирующим синтаксисом.
- Вы хотите уменьшить размер кода, используя Встряхивание дерева (Вот как это сделать в WebPack и Рулон ). Вы хотите запустить свой код или уменьшить его размер по замириемости. Вы хотите условно исключить часть кода. Это требует анализа статического кода. Вы можете использовать Smart Bundler для чувствительных к размеру производственных услуг, таких как мобильные устройства, но мы собираемся увидеть более тщательные оценки стоимости при создании таких альтернативных развертываний. Эти виды анализа статического кода будут по-прежнему полезны как «Усовершенствованные методы оптимизации» для производственного кода. Вы не должен Минифицируйте свои файлы. UGLIPYS не может минимурить ES6 в данный момент (хотя существует филиал Harmoney) но Babili может иметь дело с этим. Алгоритмы сжатия делают довольно достойную работу ( не при условии, что файлы слишком мало ) и если вы не доставите операционную систему на каждой нагрузке страницы, он должен делать отлично без сжатия. В наши дни изображения и мультимедийное содержание принимают гораздо больше пропускной способности, чем код.
- Вы хотите слона в комнате:
NPM это самый большой Менеджер пакетов на планете. Большинство нетривиальных веб-приложений используют какой-код из NPM, и это подразумевает с использованием модуля Bundler. Это скоро изменится! Chrome уже поддерживает модули ES6 в Канарейка (Chrome 60 официально отправит эту функцию этого августа) и Safari – близко к отправке это ТОО время Firefox и Edge работают над этим.
Кроме того Http/2 позволяет добровольно толкать ресурсы в браузер. Это означает, что если a.js импортирует B.js и C.JS. сервер может нажать B.JS. и C.JS. каждый раз a.js получает, что минимизирует время между запросами. Это, конечно, упрощенный вид, потому что на практике браузер уже может быть B.JS. и C.JS. в его кэш. Http/2 это поддерживается в большинстве браузеров Отказ
Будущее без трансигации
Учитывая статистику выше, это означает, что 2018 год будет год, когда большинство веб-приложений могут избавляться от бингалеров или транспортов модулей.
Транспинация – это обходной путь. Мы могли бы сделать это слишком долго, чтобы мы привыкли к этому, но подумайте об этом. Мы «компилируем» «интерпретируемый» язык для «интерпретированного» языка! Помимо:
- Настройка WebPack/Browserify – это ненужный налог во многих случаях
- Отладка с использованием SourceMaps всегда сложнее, чем отладка фактического запуска сценария (кому-то весело пыталось отладить
этоили переменные, когда SourceMaps не работает должным образом?) - Он убивает DX, когда вы должны ждать несколько секунд (иногда полминуты) после каждого редактирования, чтобы увидеть последний код. Reloading Hot модуль (HMR) – это ответ на это Но это не всегда гладко и быстро настроить. Без транспитации все, что вам нужно сделать, это обновить страницу и менее чем на секунду ваша последняя страница!
Этот август, когда модули ES6 поставляются, некоторые типы приложений вообще не будут использовать транспиляцию:
- Хромированные расширения
- Электронные настольные приложения
- Веб-приложения B2B, которые сделаны для управления бизнес-пользователями, которые уже имеют хорошие передачи, предоставляемые компанией
Когда транспиляция становится все прошло, Библиотеки с синтаксисом Hyperscript принесет идеи реагирования на Похищать (Простой старый JavaScript, который не транспирован и легко отладки на консоли).
Не транпировать, а компилировать для реального!
Wasm Новый ребенок в городе, и это официальная цель компиляции, которая обещает Быстрее скорость выполнения и меньший размер кода Отказ В настоящее время Chrome и Firefox Поддержка Wasm Но среди крупных поставщиков браузера есть хороший консенсус, который станет обычным временем выполнения будущего. Если у вас есть хром, вы можете попробовать .
Если вы такой разработчик, который зудит за что-то новое, посмотрите на Ржавчина Отказ Это Компилируется на WASM Но не ограничивается ими собой. Люди на самом деле используют это, чтобы написать операционная система или Браузерной двигатель Отказ Помимо старых временных разработчиков C/C ++ Утвердить и нравится это И у него очень приветственное сообщество.
Несколько нот
- По словам бывшего мозиллы CTO Chrome выиграл И вряд ли будет очередной браузерной войны. Интересно, что Chrome выиграл это с меритократией . Это открытый источник и Google четко определен Какую информацию это собирается от пользователей. Chrome Wins Даже бизнес-пользователи который традиционно используют окна. Тем не менее, в то время как конечные пользователи выбирают Chrome из-за его скорости, безопасности и простоты, программисты любят свои инструменты разработчика. Google имеет активную роль в TC39, которая управляет будущим JavaScript и в целом является самым сильным сторонником веб-платформы, даже если он может конкурировать со своей собственной мобильной ОС. Не только это, но Google также помогает своим конкурентам. Google был одним из крупнейших финансовых сторонников Mozilla и ее рендеринг двигателя используется Opera.
- Microsoft официально Образованная поддержка для IE около 17 месяцев назад. IE 11 будет продолжать получать обновления безопасности до 2025 года, но вам решать расходы Значительные ресурсы Чтобы поддержать браузер, который использует только 3,24% рынка. Также имейте в виду, что EDGE – это браузер по умолчанию в Windows 10. Если кто-то не хочет обновить свои окна до последней версии, недавний Wannacrypt атака вероятно, дает им повод пересмотреть! Я лично интересуюсь любым рыночным исследованием по доходу, исходящим из этого конкретного сегмента клиентов.
- Apple поставила Набор несправедливых ограничений Чтобы оставить других поставщиков браузера из своей платформы iOS. Таким образом, например Chrome на iOS технически ограничен частями двигателя Safari! Сафари Раньше был новым IE До конца 2016 года они сделали хорошую работу и стали браузером с лучшей поддержкой ES6:
В целом Глобальная доля IOS/Safari меньше, чем Android/Chrome. Это варьируется в зависимости от страны, например, в богатых странах IOS имеет немного более высокое проникновение, в то время как в развивающемся мире Android является абсолютным победителем Но вот во всем мире здесь статистика:
Призыв к действию!
Если вы достаточно взрослый, вы, вероятно, можете вспомнить раздражающие дни, когда некоторые веб-сайты вынуждены (или вежливо предложены) их браузер выбора (в основном IE):
Мы не хотим это сделать! Независимо от того, насколько взволнован мы о Chrome, мы не хотим игнорировать 46% веб-трафика, не оказываемого Chrome.
У нас всегда будет люди, застрявшие старым браузером в их телевизионной прошивке или системе инфаминирующей машины. У нас всегда будет, что упрямая дедушка, которая не видит необходимости инвестировать в модернизацию его машины, чтобы оставить его как наследие. Дети будут продолжать использовать старый iPhone или планшет своего родителя и 1 ноутбук на ребенка не вырастет некоторую обработку власти за ночь. Мы не хотим никого заблокировать.
Это не новая проблема, хотя. Несмотря на то, что ES6 является одним из самых больших изменений в Интернете, Изящная деградация все еще может обеспечить некоторое использование для меньшинство сохраняя расходы на разработку под контролем для большинства.
В будущем посту я буду обсуждать практическую сторону того, как отправить современный код, имея план резервного копирования для изящной деградации. Вы можете следовать за мной в Twitter или Medium, чтобы оставаться настроенными.
Бонус: Посмотрите на JS CodeShift Отказ Это CLI для преобразования старого кода JavaScript на новый код JavaScript обновляя даже старые вызовы библиотеки JavaScript на их новейшие API. Он пытается сохранить столько же, сколько возможно исходное стиль. Рабочий процесс: После совершения изменений в управлении версиями запустите это и выполните тщательное сравнение и запустите автоматические и ручные тесты. Выполнено!
Обновление 1 (2017-09-8): Chrome 61 приземлился несколько дней назад с полной поддержкой модуля ES6. Он имеет 54% мирового рынка браузера. Safari (14% мирового рынка) на некоторое время поддерживает модули ES6.
Обновление 2 (2017-09-10): Вы все еще можете поддерживать браузеры, которые не поддерживают модули ES6 благодаря этот трюк
Обновление 3 (2017-09-12): Модули ES6 поддерживают земли в браузерах: пришло время переосмыслить пакет?
Обновление 4 (2017-09-12): Модуль – это отложить красный по умолчанию. Если вы хотите обойти это, добавьте async атрибут тегу скрипта, чтобы предотвратить Одиночная точка отказа (SPOF) Отказ
Обновление 5 (2017-09-13): Узел LTS 8.5 Поддерживает модули ES6 (называется ESM) за флагом, когда файл имеет * .msj расширение. Вот a Хорошее вступление о том, как они используются.
Обновление 6 (2017-09-22): здесь Это несколько отличных практических советов для поддержки как новых, так и старых браузеров. Экономия пропускной способности для предотвращения транспиляции отлично!
Обновление 7 (2018-01-15): Лебаб (Реверс Вавила) у меня есть CLI для модернизации JavaScript старого стиля. Это немного похоже на CodeShift
Наиболее широко развернутая ошибка в истории вычислений открылась для нас прекрасная возможность! Читать Почему мы должны убедить наших пользователей обновлять свои браузеры?
Оригинал: “https://www.freecodecamp.org/news/you-might-not-need-to-transpile-your-javascript-4d5e0a438ca/”