27 марта 2025 г. (изменено: 27 марта 2025 г.)
Канал: @cherkashindev
🔄 **Обновляем caniuse-lite
**
Когда стали использовать реакт, мы взяли стандартный create-react-app, в котором использовался browserslist. Конфиг был стандартный.
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
}Потом мы, конечно, совершенно забыли как работает browserslist, и успешно игнорирывали следующее сообщение при билде.
Browserslist: caniuse-lite is outdated. Please run:
npx update-browserslist-db@latest
Why you should do it regularly: https://github.com/browserslist/update-db#readme
Так в чём проблема? 🤔
caniuse-lite - легковесная версия, той самой базы caniuse.com. Время идёт, появляются новые версии браузеров, а мы используем старую базу, и все наши запросы ">0.2%" работают с браузерами пяти летней давности.
То, есть запрос ">0.2%" выбирал браузеры, у которых доля рынка была больше 0.2% 5 лет назад.
А это значит, что
- async/await преобразуется в длинную партянку кода в ES5
- стрелочные функции
() => {}заменяются наfunction() {} - никаких
let/const, только старокрестьянскийvar - в код попадают ненужные полифилы
В общем, если давно не обновляли caniuse-lite открываем консоль и запускаем:
npx update-browserslist-db@latestЕсли у вас pnpm монорепозиторий — используйте команду:
pnpm up caniuse-liteМы обновились и наши жирные бандлы прилично похудели.
407.31 KB (-100.86 KB) build/bundle-1.js
369.3 kB (-34.64 kB) build/bundle-2.js
220.67 KB (-18.86 kB) build/bundle-3.js