Выжимка первого дня React Conf: Краткий обзор

React Compiler это взрыв мозга. Анонс React Router v7. Серверные компоненты даже на React Native и многое другое нам рассказали только в первый день конференции. Я подготовил для вас краткую выжимку по всем докладам
Конференция день 1 - • React Conf 2024 Day 1
Ссылки на доклады:
- начинается эра фреймворков - • React Conf 2024 Day 1
- metadata - • React Conf 2024 Day 1
- actions overview, ref, React 19 rc - • React Conf 2024 Day 1
- React compiler - • React Conf 2024 Day 1
- React Router v7 - • React Conf 2024 Day 1
- что нового в React 19? - • React Conf 2024 Day 1
- переписываем проект на React 19 - • React Conf 2024 Day 1
- глубже в React Compiler - • React Conf 2024 Day 1
- Дэн Аюрамов, откуда появились RSC - • React Conf 2024 Day 1
- RSC на RN - • React Conf 2024 Day 1
Short talks:
- Real-time server components - • React Conf 2024 Day 1
- React 19 Deep Dive: Coordinating HTML - • React Conf 2024 Day 1
- Let’s break React’s rules - • React Conf 2024 Day 1
- RedwoodJS, now with React Server Components! - • React Conf 2024 Day 1
ТГ канал - t.me/it_sin9k
Поддержать Айти Синяка можно здесь:
KZread: / @it-sin9k
boosty: boosty.to/sin9k
Patreon: / itsin9k
00:00 Анонс темы
00:27 Эра фреймворков
01:08 Metadata
01:28 Actions, refs
02:24 React Compiler
03:37 React Router v7
05:25 Что нового в React 19?
06:49 Переписываем проект на React 19
07:03 Глубже в React Compiler
07:27 Дэн Аюрамов, откуда появились RSC
07:53 RSC на RN
Подписаться на канал: / @it-sin9k
Twitter: / it_sin9k

Пікірлер: 116

  • @OCTAVIAN_JR
    @OCTAVIAN_JR28 күн бұрын

    я использовал forwardRef для создания компонента с оберткой React hook form для input

  • @igorkushnir4966

    @igorkushnir4966

    27 күн бұрын

    Я тоже)

  • @ashimov1970

    @ashimov1970

    20 күн бұрын

    + (я для эл-та dialog)

  • @HIghtowerSever
    @HIghtowerSever28 күн бұрын

    Спасибо, наш синий друг.

  • @mishanep
    @mishanep27 күн бұрын

    Хороший обзор. Спасибо!

  • @it-sin9k

    @it-sin9k

    27 күн бұрын

    о какие люди) от вас Михаил это вдвойне приятнее слышать)

  • @iliagalperin3968

    @iliagalperin3968

    13 күн бұрын

    Когда 2 гуру фронтэнда встретились в комментариях🔥🔥🔥

  • @user-yx7rm5pl9c
    @user-yx7rm5pl9c28 күн бұрын

    Спасибо! Контент как всегда супер

  • @omak3313
    @omak331328 күн бұрын

    Спасибо большое! Ждём выжимку второго дня)

  • @vitalii4329
    @vitalii432928 күн бұрын

    Годнота! Спасибо за контент

  • @user-uj4ju3lv4d
    @user-uj4ju3lv4d28 күн бұрын

    Благодарю за выжимку!

  • @atlantatesla9348
    @atlantatesla934828 күн бұрын

    Рада, что подписана на тебя) Очень полезный контент. Благодарю!

  • @it-sin9k

    @it-sin9k

    28 күн бұрын

    вижу много комментариев от тебя) рад быть полезным и добро пожаловать!)

  • @atlantatesla9348

    @atlantatesla9348

    28 күн бұрын

    @@it-sin9k Спасибо! Я сейчас готовлюсь к собеседованиям и восполняю пробелы

  • @atlantatesla9348

    @atlantatesla9348

    28 күн бұрын

    ​@@it-sin9k я сейчас готовлюсь к собеседованиям, поэтому активно заполняю пробелы)

  • @it-sin9k

    @it-sin9k

    28 күн бұрын

    да) я сам тоже готовлюсь к собесам и вспоминаю свои видосы))

  • @atlantatesla9348

    @atlantatesla9348

    28 күн бұрын

    ​@@it-sin9k странно) Я пару раз пыталась написать здесь комментарий про подготовку к собеседованию, но при перезагрузке страницы он исчезал. Но получается, ты на него всё равно ответил)

  • @nikm1108
    @nikm110828 күн бұрын

    + кто не смотрел трансу и надеялся на синяка ❤

  • @it-sin9k

    @it-sin9k

    28 күн бұрын

    Лучший!)

  • @DavidTch
    @DavidTch27 күн бұрын

    Ман люблю твои обзоры спасибо ❤

  • @it-sin9k

    @it-sin9k

    26 күн бұрын

    спасибо!) это новый формат для меня) но кажется получилось неплохо)

  • @BorshBlack
    @BorshBlack28 күн бұрын

    forwardRef использовал в основном в ui-kit'ах, в связке с useImperativeHandle для того, чтоб через рефку можно было вызвать различные методы компонента (который был обернут в forwardRef)

  • @it-sin9k

    @it-sin9k

    27 күн бұрын

    да, это рабочий кейс :)

  • @user-no7sl1yk3f
    @user-no7sl1yk3f18 күн бұрын

    Вопрос по поводу forwardRef. Когда вы сказали что никогда не юзали его, я начал переживать что я что-то делаю не так. Такой юзкейс: Есть кнопка-элемент, который может использоваться в разных списках. Стили в списках должны быть одинаковые, но функциональность может отличаться. К примеру в первом списке я хочу чтобы этот элемент можно было перетаскивать (DnD) и вызывать callback, а в другом списке, чтобы просто вызывался callback, без DND. Для этого соответственно я в первом компоненте просто стилизую компонент (uikit), прокидываю пропсы, а для конкретного списка уже буду его использовать и обвешивать логикой в другом компоненте. Так вот библиотека react-dnd, например, возвращает мне ref, который я должен привязать к элементу, который будет перетаскиваться. Как можно ещё помимо forwardRef прокинуть ref в мой первый компонент, который находится в uikit? Я действительно возможно не знаю более правильного и простого способа, буду рад научиться

  • @user-ms5vu1zp9d
    @user-ms5vu1zp9d28 күн бұрын

    Огонь

  • @nctay
    @nctay27 күн бұрын

    Ветер дует в сторону фреймворков с тех пор как CRA перестал быть стандартом. Даже SPA сегодня проще и надежнее собрать не ремиксе или нексте. А теперь мы полностью возвращаемся к полусерверным приложениям.

  • @snatvb
    @snatvb28 күн бұрын

    по react router - там смысл в том, что remix сильно полагался на react router, и фичи начались перемешиваться, remix и react router двигались навстречу друг к другу и вроде как они сливаются

  • @it-sin9k

    @it-sin9k

    28 күн бұрын

    да, там уже сильно перемешано все)

  • @snatvb

    @snatvb

    28 күн бұрын

    @@it-sin9k угу, судя по всему будут фреймворки основанные на рутерах, и каждый потом сможет чет свое построить

  • @true227

    @true227

    25 күн бұрын

    Так там даже разработчики одни и те же

  • @TheMrArmbull
    @TheMrArmbull28 күн бұрын

    ", а все самое интересное смотрите в предыдущем видео..."

  • @it-sin9k

    @it-sin9k

    28 күн бұрын

    ахахах) ну почти да)

  • @HEX_CAT
    @HEX_CAT28 күн бұрын

    🥰🥰🥰

  • @Virisound
    @Virisound28 күн бұрын

    Спасибо большое, очень мило с твоей стороны, для нас так потрудится. 🧞‍♂️

  • @it-sin9k

    @it-sin9k

    28 күн бұрын

    спасибо!) да я сам до ночи смотрел доклады)

  • @Virisound

    @Virisound

    28 күн бұрын

    ​@@it-sin9k, верю. 🙂👍

  • @user-if2xz6yu9p
    @user-if2xz6yu9p28 күн бұрын

    Привет, спасибо за выжимку! оригинальное видео недоступно? Через ВПН только или другая причина?

  • @it-sin9k

    @it-sin9k

    28 күн бұрын

    Хмм, кажется да, нужен ВПН

  • @ZhenyaGoroh
    @ZhenyaGoroh27 күн бұрын

    Почему сейчас все видео конференций не доступны?

  • @it-sin9k

    @it-sin9k

    27 күн бұрын

    кажется у них ограничения по региону, пробуйте ВПН

  • @PalladinGOLD
    @PalladinGOLD24 күн бұрын

    @it-sin9k Вопрос по реакту. Можешь подсказать. Если в реакте мы в фазу рендера в реконсилейшн только формируем эффект лист, а в коммит фазу уже начинаем ее исполнять, то в фазу коммита пользователь никак не может прервать, так? Но как react определит стоит ему создавать новое воркИнПрогресс дерево или нет, в момент прерывания в фазе рендера

  • @it-sin9k

    @it-sin9k

    24 күн бұрын

    в такой глубине я тоже могу лишь предполагать как это работает. По идее теперь есть concurrent mode и все работает не так линейно. По идее работает система тасок, и главное выполнять реакту таски, а таски теоретически могут быть с разных фаз

  • @fedormakareev7108
    @fedormakareev710828 күн бұрын

    Видимо пора миграировать на 6 роутер, скоро нужен SSR, вся лгика роутера на 5 версии и ее довольно таки много, а вот next тащить не хочется делал несколько проектов и это кошмарная тулза, редко удается собрать столько дурацких проблем.

  • @it-sin9k

    @it-sin9k

    28 күн бұрын

    да, это большой вопрос, как начинать новые проекты в 2025 году)

  • @snatvb
    @snatvb28 күн бұрын

    по forwardRef - постоянно юзаем, как без него UIKit вообще построить то? А compound component?

  • @it-sin9k

    @it-sin9k

    28 күн бұрын

    а можно кейс рабочий какой?

  • @BOCbMOU

    @BOCbMOU

    28 күн бұрын

    @@it-sin9k банально свою кнопку сделать, как тут без рефа? Даже если в данный момент реф не нужен.

  • @snatvb

    @snatvb

    28 күн бұрын

    @@it-sin9k да прост кнопку делаешь, я не хочу все пропсы дива описывать, так же иногда может нужно будет взять реф от него, я же не знаю, что юзеру моего кода в голову взбредет. Паттерн декоратор обязывает тебя сохранять поведение расширяя компонент. Я добавляю размер и тему, таких пропросв нет и остальное все поведение сохраняю как есть. Так в целом большинство компонентов пишется. Посмари shadcn ui, radix ui - пожалуй это самые лучшие решения для ui, что я встречал. Я работал с mui, ant design, chakra, и какими то еще, и все они просто на несколько голов хуже чем озвученные ранее :)

  • @mulfyx

    @mulfyx

    28 күн бұрын

    @@snatvb с ark ui работал? радикс залупа, селект 100кб весит)

  • @snatvb

    @snatvb

    28 күн бұрын

    @@mulfyx спасибо за наводку, чекнул мельком, идея такая же как и у радикса. Я говорил про сам подход, в некоторых кейсах реализация может хромать конечно. Тип того же селекта) хоть по селекту еще вопрос, есть ли решение получше. Потому что ark судя по всему придется тащить весь. У радиска там прост много че для него тянется из своих же частей

  • @omak3313
    @omak331328 күн бұрын

    Интересно, где можно записи посмотреть или скачать? особенно выступление Лидии Хейли. На канале React Conf трансляции 2 дней уже скрыты((

  • @sergks1846

    @sergks1846

    27 күн бұрын

    через vpn доступны

  • @omak3313

    @omak3313

    27 күн бұрын

    @@sergks1846 попробовал через vpn открыть канал React Conf - все равно нет трансляций на канале

  • @omak3313

    @omak3313

    27 күн бұрын

    @@sergks1846 через vpn тоже скрыты трансляции

  • @omak3313

    @omak3313

    27 күн бұрын

    @@sergks1846 увы, нет

  • @it-sin9k

    @it-sin9k

    25 күн бұрын

    Вот только открыть опять стрим, у меня все работает

  • @Armas0n
    @Armas0n28 күн бұрын

    То, что синяк за 6 лет опыта реакта никогда не юзал рефы на реакт компонентах, это такой хитрый байт на комменты? 🧐 Ну а если серьезно, неужели не возникала необходимость из родителя управлять каким-то состоянием html в дочерних компонентах? Ну и если пользовался библиотеками готовых компонентов, где нужно прокидывать ref в качестве пропса - считай пользовался forwardRef-ом.

  • @it-sin9k

    @it-sin9k

    28 күн бұрын

    Я обычно переименовывал props с ref на reference и все прекрасно работало :)

  • @swayok

    @swayok

    28 күн бұрын

    @@it-sin9k Хе. Я не один такой =) Пробовал юзать forwardref в общих UI компонентах пару раз, но это было крайне неудобно, особенно в паре с memo. Плюнул и начал передавать через обычные пропсы.

  • @gffftxxx

    @gffftxxx

    28 күн бұрын

    @@it-sin9k не уверен что useImperativeHandle будет в этом случае работать когда необходимо ограничить доступ к dom элементу

  • @miangel0
    @miangel026 күн бұрын

    По ссылкам на видеоролики пишет, что видео не доступно

  • @it-sin9k

    @it-sin9k

    26 күн бұрын

    У них походу ограничения по региону, нужен ВПН

  • @ivanrussui4126
    @ivanrussui412622 күн бұрын

    Благодарю. Вопрос если ставишь Некст то там свой роутер, как тогда быть с Реакт роутером 7?)

  • @it-sin9k

    @it-sin9k

    22 күн бұрын

    так это альтернативные варианты написания проекта, их не нужно вместе использовать :)

  • @ivanrussui4126

    @ivanrussui4126

    22 күн бұрын

    @@it-sin9k это да) выходит что данный роутер актуален только юзая Реакт как отдельную библиотеку. Если юзать как советуют гуру-разрабы внутри фреймворка, то значит роутером 7 не пользуешься. Хотя я не знаю как там в Ремиксе и др с роутерами.

  • @1NortGod
    @1NortGod25 күн бұрын

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

  • @it-sin9k

    @it-sin9k

    25 күн бұрын

    тут надо отделять, команда React и их официальный сайт рекомендуют использовать только фреймворки. НО создатели библиотеки react-router продвигает свой продукт и хочет, чтобы он продолжал жить и адаптирует его под новую реальность. Возможно это обретет определенную популярность и React начнет это тоже рекомендовать, кто знает.

  • @user-ci2he1nx6z
    @user-ci2he1nx6z27 күн бұрын

    Синячелло, ну, эти рекомендации по SSR фреймворкам... если же нужен просто SPA, то это по прежнему create-react-app, верно же?

  • @c01nd01r

    @c01nd01r

    27 күн бұрын

    Просто vite

  • @it-sin9k

    @it-sin9k

    26 күн бұрын

    думаю уже create-react-app умер. Сейчас для SPA есть лишь 2 варианта: - делать eject для CRA или самому поддерживать проект - либо же vite, он активно набирает популярность. Даже react-router v7 по идее сильно на него завяжется

  • @Mr.Bellamy

    @Mr.Bellamy

    26 күн бұрын

    где то в проде юзают cra еще?

  • @user-no7sl1yk3f
    @user-no7sl1yk3f28 күн бұрын

    Единственный нормальный синяк

  • @it-sin9k

    @it-sin9k

    28 күн бұрын

    звучит как тост!)

  • @scffsz
    @scffsz28 күн бұрын

    У меня одного видео из описания недоступны?

  • @it-sin9k

    @it-sin9k

    28 күн бұрын

    Кажется нет, нужен походу ВПН

  • @KostaRMax

    @KostaRMax

    28 күн бұрын

    Аналогично, даже с системным впн нет доступа

  • @ashimov1970
    @ashimov197020 күн бұрын

    спасибо! но ззачем ты взял погонялово "синяк" (алкаш, для тех кто в танке)?

  • @it-sin9k

    @it-sin9k

    20 күн бұрын

    Потому что синий и легко запомнить)

  • @rimoli-ny1mr
    @rimoli-ny1mr28 күн бұрын

    Если они ускорили Facebook на 12 процентов просто с компайлером, то именно на столько он бил не оптимизирован самими дорогими инженерами современности))))

  • @it-sin9k

    @it-sin9k

    28 күн бұрын

    да) они показывали кодовую базу, и они пытались оптимизации все настроить, но на 12% им не удалось))

  • @uwontrememberthis
    @uwontrememberthis27 күн бұрын

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

  • @it-sin9k

    @it-sin9k

    26 күн бұрын

    почему?

  • @DreamingDolphing
    @DreamingDolphing28 күн бұрын

    О боже, они опять полностью переделали реакт-роутер.

  • @user-md5mw1tp3e
    @user-md5mw1tp3e28 күн бұрын

    Пока к компилчтору много вопросов. Какие у него ограничения? В каких случаях он отработает, а в каких нет? Не будет ли он амешиваться в работу state менеджеров?

  • @jyjyjyj3

    @jyjyjyj3

    28 күн бұрын

    Стейт менеджеры основанные на работе через proxy работать не будут. Например MobX

  • @jyjyjyj3

    @jyjyjyj3

    28 күн бұрын

    А насчет того как работает у Jack Harrington-а есть хорошее видео на эту тему

  • @PavelKhapaliuk
    @PavelKhapaliuk28 күн бұрын

    Ни одна ссылка под видео не работает

  • @it-sin9k

    @it-sin9k

    28 күн бұрын

    Они блокируют по региону, нужен ВПН

  • @KanalReal
    @KanalReal28 күн бұрын

    начинал изучать react 17, а уже 19 😂😂

  • @it-sin9k

    @it-sin9k

    28 күн бұрын

    надо поторапливаться!)

  • @rusfungame
    @rusfungame28 күн бұрын

    Как же круто что теперь реакт приложения грузятся не за 2,5 секунды, а за 2,4. У меня просто на работе three.js грузится секунд 15-50. Мне эти 0000.1 секунды от оптимизации реакта ваще ничего не дают.

  • @it-sin9k

    @it-sin9k

    28 күн бұрын

    Ну если ваш проект улучшится на 12%, то по идее он будет запускаться за 13-44 секунды :)

  • @rusfungame

    @rusfungame

    28 күн бұрын

    @@it-sin9k Топ, спасибо за совет

  • @Mr.Bellamy
    @Mr.Bellamy26 күн бұрын

    без forwardRef не обойтись если пилишь свои кастомные ui компоненты с намеком на универсальность)

  • @it-sin9k

    @it-sin9k

    26 күн бұрын

    я обычно через props прокидывал, например называл reference, так многие пакеты делают

  • @AlexanderBorshak
    @AlexanderBorshak28 күн бұрын

    Never use React again! )))

  • @it-sin9k

    @it-sin9k

    28 күн бұрын

    не надо богохульствовать))

  • @kaifaty

    @kaifaty

    27 күн бұрын

    рад, что есть все таки здравомыслящие

  • @ell1ar
    @ell1ar28 күн бұрын

    Аишная озвучка иногда сильно режет слух)

  • @rvoskanyan

    @rvoskanyan

    28 күн бұрын

    Это не AI, живой голос не много подкрученный софтом

  • @ell1ar

    @ell1ar

    27 күн бұрын

    @@rvoskanyan не соглашусь. Иногда очевидные ударения и интонации звучат не так, как нормальный человек говорит в жизни. Ждем коммент синяка)

  • @rvoskanyan

    @rvoskanyan

    27 күн бұрын

    @@ell1ar Автор сам рассказывал как-то в однои из интераью😁

  • @rvoskanyan

    @rvoskanyan

    27 күн бұрын

    @@ell1ar kzread.info/dash/bejne/h5-urah_e5XKZag.html

Келесі