Вхід і реєстрація
Розробка · 19 червня, 15:00 3173
Olexander Smolianinov, frontend lead в ZFORT Group

Front-end Digest № 0: Developer Survey-2023, можливості TypeScript 5, звіт з CSS Day

Усі статті, обговорення, новини про Front-end — в одному місці. Підписуйтеся на телеграм-канал!

Привіт, колеги. Мене звати Олександр і я займаюся фронтендом в компанії Zfort Group. Пропоную вашій увазі дайджест з новими та цікавими матеріалами зі світу фронтенда за останній тиждень.

Веброзробка

• Результати 2023 Developer Survey: останні тенденції в технологіях та роботі від спільноти Stack Overflow
• Вебшрифти: як зробити так, щоб вони ідеально працювали в електронних листах
• Перед наступним фронтенд пул-реквестом використовуйте цей чек-лист
• Дослідження GitHub висвітлює вплив AI на розробників
• Вивчаємо можливості TypeScript 5: менше, простіше, швидше
• Chrome для тестування: надійні завантаження для автоматизації браузера

CSS

• Недоліки вкладеності CSS (CSS Nesting)
• Перебудова компонента коментарів за допомогою сучасного CSS
• Як додати CSS-анімацію з’явлення зображень
• Мій власний CSS Reset
• Тестування підтримки браузером CSS-функцій за допомогою feature queries
• Звіт з CSS Day, який пройшов 8-9 червня в Амстердамі
• Дизайн проти доступності та visually-hidden клас в CSS

JavaScript

• Під капотом JavaScript Imports
• Головний біль Гетсбі і як його вилікувати: i18n
• Настав час замінити ваш axios
• Як вийти з ForEach у JavaScript?

Теми: Angular, CSS, Front-end, front-end digest, JavaScript, react, tech, Vue
👍ПодобаєтьсяСподобалось13
До обраногоВ обраному5
LinkedIn
Дозволені теги: blockquote, a, pre, code, ul, ol, li, b, i, del.
Ctrl + Enter
Дозволені теги: blockquote, a, pre, code, ul, ol, li, b, i, del.
Ctrl + Enter
Ihor Zenich Frontend Developer в EPAM 30.06.2023 00:36

Круто что переехал на DOU.
Успехов!

Відповісти
Підтримати
Dmitriy Mozgovoy JavaScript / NodeJS Developer 20.06.2023 21:34
Як вийти з ForEach у JavaScript?

ото проблеми у людей, варті цілої статті :)

Настав час замінити ваш axios

черговий вбивця акcіоса (хоча скоріше реактКвері) цього місяця...

Відповісти
Підтримати
Olexander Smolianinov frontend lead в ZFORT Group 20.06.2023 21:56

Ну, статті бувають для різних рівнів.. При складанні дайджеста це завжди хиткий момент, бо якщо відбирати тільки хардкорні матеріали для сеніорів, то джуни та інші початковці не будуть зацікавлені, а їх за статистикою більше. І навпаки, поверхневи матеріали знецінюють користь дайджестів для більш «шарящих» , але можуть бути корисними початківцям. Тому якось доводиться балансувати. Ну і про ForEach не така вже й погана стаття :)

Відповісти
Підтримати
Dmitriy Mozgovoy
Stas Software Engineer 21.06.2023 18:06
якщо відбирати тільки хардкорні матеріали для сеніорів, то джуни та інші початковці не будуть зацікавлені

тоді можна робити 2 підбірки в одному дайджесті

Відповісти
Підтримати
Olexander Smolianinov
Igor Golodnitsky те самые 5k$ в PreciseQ 21.06.2023 10:26

Всегда удивлял размер библиотеки axios и на черта он нужен (особенно такого размера)?

Відповісти
Підтримати
Dmitriy Mozgovoy
Dmitriy Mozgovoy JavaScript / NodeJS Developer 21.06.2023 17:33
Всегда удивлял размер библиотеки axios

11кб min.gz? Не такий і жирний особливо як для часів, коли лендінги по 1мб, а на фоні крутять декоративні відосики. Кросплатформеність не дешева та і «хотелки» постійно ростуть, хоча більшість крім CRUD з json нічого і не використовують.
Ну і все одно це кешована статика. Взагалі б не було цих питань з розміром на такому рівні, якщо б браузери в часи появи npm зробили офіційну інтеграцію з ним та дзеркалами для import директиви з транспортом через вебсокети/http2, мали окремий оптимізований кеш-стор для модулів, і всі сайти автоматом шарили єдиний екземпляр, але з semver.

(особенно такого размера)

А можливо стане ще трохи більшим, якщо підтримку хуків та плагінів завеземо :)

Відповісти
Підтримати
Igor Golodnitsky
Igor Golodnitsky те самые 5k$ в PreciseQ 21.06.2023 18:01

Я сайты делаю с 2003.

Тогда как бы проблемы кроссплатформенности состояли в том что API было мало, и они могли быть разными или работать по разному в браузерах. Сейчас проблемы кросс-платформенности считай нет. Может разве-что в SSR и каких-то стремных мобайл вариантах нарваться. Или недавно нарывался на неожиданности между версиями хром недавними.
Когда требовалась поддержка IE6 или IE8, то было совсем другой уровень проблемы.

npm зробили офіційну інтеграцію

С тем npm, в который льют всякий мусор, оно все тормозит в тысячах зависимостей, а обиженные создатели популярных библиотек в 3 метода, рушат тысячи других пакетов ради прикола.

11кб min.gz

Если например сравнить с jquery 1.6, в котором был между прочим
ajax + promise (он занимает весь 28 kb gz.)
да и дело ж не только в gz размере, важнее скорость обработки — тоесть размер minified варианта, чем скорость загрузки файла по сети.

Вероятно у axios есть какие-то важные фичи, но в видосах я часто замечал, что его тащут так шоб було, максимум как fetch polyfill и то зачем для поддержки IE11? Тот год или два когда он был ценен был весьма не долог.

підтримку хуків та плагінів завеземо :)

Чавой, куда эти хуки будут вести?)

Відповісти
Підтримати
Dmitriy Mozgovoy
Dmitriy Mozgovoy JavaScript / NodeJS Developer 21.06.2023 19:22

До ослів це вже далеко відмотали. Коли приймалася десь специфікація ESM треба було розробити і специфікацію якогось там module store, що мав авторизований пул дзеркал і можливо підпис sha як опцію, щоб розробник не задумувався звідки воно там бере ті модулі і не пхав їх в бандл разом зі своїм кодом. Так кеш би не забивався 100500 копіями бібліотек в бандлах чи різних CDN, а на умовних 100мб можна було би зберігати не один десяток тисяч модулів в стиснуному виді, без дубляжів, що зараз просто копійки навіть для мобільних платформ.

С тем npm, в который льют всякий мусор

Ну а яка різниця? За плечами той мусор не носити, бо умовно топові пакети мусор в залежностях не мають.

он занимает весь 28 kb gz.

Чим більший файл з однаковими токенами, тим краще він стискається, так що в сумі різниця дуже велика.

тоесть размер minified варианта

Швидкість парсингу в AST явно не те, де можуть бути якісь проблеми. Навіть якщо мова про швидкість ініціалізації його VM та виконання самого скрипта в контексті, то це все зовсім копійки в теперішні часи де в кармані по 8+ ядер. Навіть десятки мілісекунд для користувача це ніщо, порівняно з часом який витрачається фреймворком на ініціалізацію та рендеринг всіх тих UI бутербродів.

что его тащут так шоб було

Ну правильно. Використання уніфікованих звичних інструментів, навіть якщо там зайві пару кб на практиці приносить більше користі в комерційній розробці, чим економія на сірниках. Зараз там не треба фіча, завтра вона знадобиться і почнеться писанина потенційно кривих велосипедів. Попри простоту базових функцій, всі гугли з ютубами забиті туторіалами з одним і тим же.

Тот год или два когда он был ценен был весьма не долог.

до 2016 виходить? :)

Чавой, куда эти хуки будут вести?)

Та все туди ж куди і інтерсептори + куча інших місць типу init, request, dispatch, retry, redirect etc з onion моделлю типу як у koa2, бо треба максимальна гнучкість під плагіни, щоб не лізли в прівейт с патчінгом

Відповісти
Підтримати
Igor Golodnitsky
Віктор Павлов Frontend developer в FFW 20.06.2023 16:09

Дякую, нарешті тут :)

Відповісти
Підтримати
Alexey Tumanov 19.06.2023 23:42

Вместо «Зустрічайте Codux: візуальний редактор React, що покращує досвід розробників» лучше перевести «Зустрічайте Codux: візуальний редактор React, що покращує користувальницький досвід розробників»

Відповісти
Підтримати
Olexander Smolianinov frontend lead в ZFORT Group 19.06.2023 23:45

Дякую, пофіксив. Можна закривати таск :)

Відповісти
Підтримати
Alexey Tumanov

Підписатись на коментарі

Не підписуватись
Скористайтесь акаунтом
×
з умовами використання сайту і політикою конфіденційності.