Ayub Begimkulov - уроки по JS
3.11K subscribers
29 photos
212 links
По вопросам и деловым предложениям писать на @ayub_begimkulov
Download Telegram
Уже который раз ловлю себя на мысли о том, что не понятно, какой инструмент для сборки использовать при старте нового проекта. Да, если использовать next — то вопросов особо нет. Он из коробки приезжает cо связкой webpack + turbopack (если не ошибаюсь, пока только для дева, на проде вебпак). Может местами не идеально, но улучшаться в будущем будет.

Но если проекту не нужен SSR, то не понятно, что выбирать. create-react-app уже не поддерживается. Да и его по итогу приходилось всегда кастомизировать. Есть новый и быстрый Vite. Но всё равно смущает отсутствие большого набора плагинов (тот же bundle analyze очень не удобный) и слышал много жалоб о билде в продакшен (там используется rollup, а не esbuild).

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

Такое чувство, будто всё в каком-то переходном состоянии находится. Вроде бы и есть новые инструменты со своими плюсами, но немного сыроваты еще. Вроде и старые есть, но не понятно, будут ли они улучшаться.

Когда меня спрашивают, что выбирать — я говорю vite. Так как проблемы, которые с ним выскакивают, обычно получается решить. Также быстрые обновления очень приятны при разработке. Ну и на крайний случай всегда на что-то другое переехать можно.

Но интересно, что вы думаете по этому поводу? Это у меня одного только такие ощущения?
28🔥9🏆3🍓3👍1
Сегодня гуляя по просторам интернета наткнулся на то, что Lodash 5-й версии находится в стадии разработки.

Но самая интересная часть заключается в том, что мейнтейнер проекта просто закрыл все старые issue с тегом issue bankruptcy. Объяснил он это тем, что после 4-х лет не работы над проектом (в связи с выгоранием), невозможно разобрать все issues/PR. С одной стороны, я могу его понять, с другой, решение прямо очень странное (и скорее всего больше эмоциональное).

Но в целом радует то, что идет работа над новым мажором. Я сам никогда не был фанатом использования lodash (по большой части из-за плохой типизации, но перформанс и размером пакета тоже можно улучшить), однако все равно он в конечном итоге оказывается у тебя в конечном бандле (а часто даже несколько штук). Поэтому новая версия точно не будет лишней.

Хотя в переходный период с 4-й на 5-ю версию в бандле с большой вероятностью можно будет увидеть 2 разных мажора библиотеки.

P.S. Также из новостей увидел выход next v13.5. Но там только улучшения по перформансу и багфиксы — https://nextjs.org/blog/next-13-5.
👍20🍓32🏆2🔥1
Часто вижу, что у людей ModuleFederation ассоциируется с микрофронтами. Хотя это по сути способ отдельно собирать и подключать в runtime какие-то сторонние модули. Да, под идеологию микрофронтов это идеально подходит. Но тем не менее, спектр использования может быть шире.

В некоторых случаях ModuleFederation можно использовать для того, чтобы подключать какие-то независимые компоненты/модули, разрабатываемые другой командой, в ваше приложение. Плюсы по сравнению с npm пакетами будут заключаться в том, что вам не придётся каждый раз пересобирать и выкатывать ваш сервис, когда обновится сторонний пакет.

Хорошим примером тут может быть компонент общих на уровне нескольких приложений нотификаций:

import {Notification} from 'NotificationsApp/Notification';

const Header = () => {
    return <div>
        {/* .... */}
        <Notification config={notificationConfig} />
    </div>
}

Обычно общие нотификации никак не связаны с нашим приложением. Их просто нужно отрендерить в правильном месте и передать какие-то опции (которые часто можно сделать обратно совместимыми).

В таких случаях, если использовать ModuleFederation, обновления будут доезжать автоматически, без лишних действий. Но минусы тоже есть - не удобная работа с тестами, типизацией и версионированием.

Поэтому для большинства случаев проще и надежнее будет использовать npm пакеты. Но об альтернативе знать тоже полезно. Иногда пригождается).
👍263🏆2🍓2
Если ещё не видели, то в пятый Svelt доезжают signal’ы (видео с разбором от Rich Harris’а по ссылке ниже).

Изменения довольно классные. Особенно зашёл новый синтаксис для пропсов и эффектов.

Но есть и другая мысль, которая у меня появилась — это то, что он теперь стал похож на solid. Раньше, если всё делалось полностью компилятором, то теперь нужно помечать ваши реактивные переменные и вычисляемые значения отдельными функциями (для чего это было сделано рассказывается в видео, посмотрите обязательно).

Но все равно компилятор до сих пор делает за вас много вещей. Вы скорее просто помечаете ваши состояния, нежели пишите на полноценных сигналах. И мне на первый взгляд такой подход кажется странным. С одной стороны, нужно понимать, как это всё работает. С другой, нет полного контроля, так как часть действий делает сам компилятор. А в конце концов получается микс реального JS и магии компилятора.

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

В любом случае, пока сам не попишешь — не узнаешь. Поэтому стоит воспринимать мои слова с долей скептицизма. И думаю когда уже будет релиз, можно будет написать какой-то проект на стриме.

По сравнению с тем, что было, улучшения прямо очень позитивные!

https://youtu.be/RVnxF3j3N8U
👍154🏆2🍓2💊2
Друзья, через 22 минуты (в 12:00 по мск) стартуем стрим. Будем продолжать пилить наш проект. У кого есть время — подключайтесь.

https://youtube.com/live/P53x_5idWZk?feature=share
11👍7🏆2🍓2
Продолжаем разработку нашего проекта в лайв формате. Начало, как обычно, в 12:00 по мск. Также буду рад ответить на ваши вопросы в чате. Подходите, кто может.

https://youtube.com/live/MHwB_Ro2pbw?feature=share
🔥92🏆2🍓2
Хотел узнать, а использовал ли кто-то в своих проектах concurrent фичи — useDeferedValue, useTransition (кроме использования с server components)? И есть ли вообще какие-то библиотеки, которые их используют?

Я вот ищу и что-то не могу ничего найти. Но наверное плохо искал…

Уже который раз ловлю себя на мысли (да думаю и не только я) о том, что сильно то ничего и не поменялось с добавлением concurrent mode для чисто клиентских приложений. Хотя… фичи с Suspence иногда могут быть полезными.

Но на практике выходит, что улучшенный батчинг, useInsertinoEffect и useSyncExternalStore будто бы больше пользы принесли. Так как конкурентный рендеринг спасает в тех ситуациях, когда кажется и так уже все плохо — есть долгий рендер, который нужно прерывать более приоритетной задачей.

В общем, если есть пример использований — буду рад, если поделитесь.
👍122🏆2🍓2
Ayub Begimkulov - уроки по JS
Уже который раз ловлю себя на мысли о том, что не понятно, какой инструмент для сборки использовать при старте нового проекта. Да, если использовать next — то вопросов особо нет. Он из коробки приезжает cо связкой webpack + turbopack (если не ошибаюсь, пока…
Под одним из прошлых постов про сборку многие отписали, что используют Next.js без SSR.

Решил изучить этот вопрос и оказалось реально можно на выходе получить полноценную статику. Правда роутинг нужно будет делать свой. File based routing с таким сетапом не будет работать.

Для новых проектов думаю получше будет, чем create-react-app. Особенно в долгосрочной перспективе.

Ну и также может быть полезно в тех случаях, когда кто-то давно создал проект с SSR, хотя он вообще был там не нужен. А на переезд нет времени.

https://dev.to/apkoponen/how-to-disable-server-side-rendering-ssr-in-next-js-1563
14🔥5🏆2🍓2👎1
Пару дней назад вышел документальный фильм про TypeScript (кажется такой формат набирает обороты). Нашел сегодня время посмотреть.

Конечно снято не так круто, как про React от Honeypot. Но все равно очень понравилось.

Особенно было интересно взглянуть на картину развития большого проекта внутри Microsoft. Какая была мотивация, продвижение в опен сорс, колаборации с другими проектами и тд.

Если есть свободное время — советую к просмотру.

https://youtu.be/U6s2pdxebSo?si=toaAlAJlf8sC2eom
🔥285👍5🏆2🍓2💊2👎1
Обычно все разработчики любят фокусироваться на хард скиллах. Хотя часто бывает, что софты не меньше влияют на ваш карьерный рост.

Думаю все видели уже разные статьи, где нанимающие менеджеры говорят о том, что процесс найма часто субъективен. Но это мы уже в другую сторону пошли…

Хотел поделиться двумя самыми большими вещами, которые помогли мне в развитии навыков коммуникации (до сих пор есть куда расти, но раньше я и пары предложений сказать не мог, не добавив несколько «аааа» и «типа»).

1) Запись и переслушивние своей речи. Да, занятие по началу не из приятных (особенно если не привыкли слушать свой голос).

Но самая большая польза заключается в том, что вы начинаете замечать проблемы в речи, которые у вас сейчас есть.

И чем больше вы будете обращать внимание на эти проблемы — тем больше вы будете стараться их исправить.

Я раньше просто включал камеру и по 10 минут говорил о рандомных темах. Потом (с трудом) пересматривал все это.

Если совсем сложно слушать свой голос — то может помочь взять более хороший микрофон. Встроенные обычно очень «утоньшают» ваш голос, что увеличивает негативный эффект.

С другой стороны, это на 100% от проблемы не избавит — так что я бы не стал только по этой причине что-то покупать.

2) Писать, писать, писать. Эта часть как раз больше помогает с формулировкой мыслей.

Чем больше пишите (на какую тему не важно), тем лучше учитесь структурировать свои мысли. Что конечно же переходит в более чистую и понятную речь.

Тут наверное основная сложность заключается в том, что процесс обдуманного написания занимает много времени. Да и сам процесс обычно скучный.

Зато результат будет намного лучше, чем от советов по типу «читайте больше книг» (я, кстати, от чтения вообще прогресса в речи не замечал).

Оба совета, как видите, не сложные. Самое главное начать их применять.
51👍20🍓5🔥4💯2🏆2
Сейчас нахожусь в небольшом разъезде, поэтому давайте вместо поста проведем тут лайв общение.
🏆14👍43🍓2👎1👏1
Live stream finished (46 minutes)
Live stream finished (1 hour)
Заходите на лайв, буду рад пообщаться и ответить на ваши вопросы.
🔥135🏆2🍓2
Live stream finished (48 minutes)
Для тех кто не видел, вышла бета TS версии 5.3.

Из основных изменений:
- Поддержка import attributes для обычных и type импортов.
- Улучшенное «сужение». Больше всего порадовал кейс со switch(true).
- Более точные проверки вызова методов через super.

https://devblogs.microsoft.com/typescript/announcing-typescript-5-3-beta/
13💊5👍4🏆3🍓2
После долгих размышлений в последние несколько дней, понял для себя, что история с двумя видео и ежедневными постами создаёт слишком большую ответственность, что ведет к неоправданному количеству стресса. До той степени, что смысл во всей этой затее теряется.

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

Посты иногда приходилось писать на коленке, не успев нормально все перепроверить. Да и некоторые из них писались просто, чтобы что-то написать. А изначально идея была делиться каким-то находками/инсайтами из своего опыта.

В итоге смысл такого графика теряется. Идёт просто погоня за цифрами, до которых никому особо и нет дела (кроме меня разве что). Не сказать, что жалею о том, что поставил себе такой челлендж. Дедлайны научили совсем по другому подходить к сбору идей и проработке контента. Но на данный момент кажется, что они несут больше вреда, нежели пользы.

Поэтому хочу (как минимум на пока) отменить ежедневные посты, 2 видео в неделю и, соответственно, розыгрыши. Забрасывать канал не собираюсь, контент будет выходить по мере возможности и свободного времени. Интересно посмотреть, что из этого получится.
👍14734🤝12🏆4🍓3