Babel (ES5/ES6)

[Kiano]

Ребята, вопрос скорее по смыслу использования новых стандартов против старых.

Большинство требований в проектах включают в себя использование ES6, при этом указано, что в проектах используется Babel, т.е. в проектах перегоняют весь код в ES5. Я не понимаю, какой смысл тогда писать по новым стандартам ES6, если всё равно на выходе будет ES5, который будет поддерживаться старыми браузерами, т.е. на сайте будет минифицированный .js с ES5.

Мне было бы понятно, если бы, например старому браузеру отдается .js с ES5, а новым .js с ES6 (видимо на уровне фантастики), но тут всё в один .js для всех.

Поясните пожалуйста!

[voraa]

Идиотизм заказчика.
Я не вижу ни одной причины, по которой нельзя использовать новый браузер для общедоступного сайта.
Единственная просматриваемая ситуация - внутрикорпоративный сайт, заточенный под ИЕ, использующий какие то ActiveX.
Ну так можно для этого сайта использовать ИЕ, а для остальной сети нормальные браузеры.

[Kiano]

voraa, ну вот я тоже подумал о внутрикорпоративном использование, когда команда разработчиков пишет в ES6, а на рабочую версию сайта(build) подключают .js, заранее прогоняя весь js-код через Babel, это видимо единственное объяснение, хоть и немного для меня странное, мол...требование писать ES6, но в рабочей версии будет ES5.

[voraa]

TS и ES6 Бабелем переведут в ES5 как то.
А с современным CSS что делать? И нафига его придумывают, если все равно все разработчики должны думать про ИЕ?
Наверно никто не использует.

[ksa]

Поясните пожалуйста!

Если всякие там проекты делаются на долго... Лучше сразу писать их на том варианте, какой будет работать и дальше.
А "переработчик" на данный момент просто помогает в "адаптации" нового стандарта на старом ПО.
Т.е. по прошествии времени "переработку" просто отменят и "поплывут под новыми парусами в светлое будущее"!

Обратное действие будет, скорее всего, не возможным.

[destus]

Мне было бы понятно, если бы, например старому браузеру отдается .js с ES5, а новым .js с ES6 (видимо на уровне фантастики)

Именно так и делают в современном мире. В Angular, например, через сравнение target в tsconfig.json и списком поддерживаемых браузеров в .browserslistrc. Похожее поведение есть и во Vue CLI (https://cli.vuejs.org/guide/browser-...ml#modern-mode)

https://habr.com/ru/post/338612/

[Kiano]

destus, спасибо, что нужно! На Gulp собираю, попробую через babel-preset-env два файла организовать и далее как в статье на хабре.

[Kiano]

А с современным CSS что делать?

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

[voraa]

Если нужно на проекте поддержка старых браузеров, то для старых браузеров выводится отдельный .css, для новых браузеров другой .css

И как в этом css для старых браузеров заменить необходимые возможности, которых нет? Если бы они были, то наверно и новые были бы не очень нужны.
Чем заменить :focus-within ?
А ведь возможности css не только в файлах css, но и в скриптах используются.
Чем заменить .querySelector('div:focus-within') или elem.querySelectorAll(':scope>div.anyclass')?

Вряд ли бабель тут справится. Т.е скрипты тоже надо писать в этом случае под старые браузеры.
Удобные возможности есть, но пользоваться ими нельзя.
Зачем же их сделали тогда?

[Kiano]

И как в этом css для старых браузеров заменить необходимые возможности, которых нет? Если бы они были, то наверно и новые были бы не очень нужны.

Если речь, например о flex или grid, то подключается PostCSS c плагином autoprefixer - https://www.npmjs.com/package/autoprefixer

Чем заменить :focus-within ?
А ведь возможности css не только в файлах css, но и в скриптах используются.
Чем заменить .querySelector('div:focus-within') или elem.querySelectorAll(':scope>div.anyclass')?

Здесь нужно смотреть в сторону Polyfill вместе с Babel.

Все это конечно выглядит очень громоздко! Мне порой кажется, что front-end разработчики сами себе усложняют жизнь, создавая какое-то невероятное кол-во софта, а может просто усложняют порог входа в эту профессию.