Solid js - signals, createEffect, createResource. Круче React?

Поділитися
Вставка
  • Опубліковано 17 жов 2024

КОМЕНТАРІ • 136

  • @PurpleSchool
    @PurpleSchool  Рік тому +1

    ⚡Полный курс по React и Next: purpleschool.ru/course/nextjs
    Все курсы: purpleschool.ru
    Telegram канал с полезными советами: t.me/purple_code_channel

  • @habalgarmin
    @habalgarmin Рік тому +18

    глоток сежего воздуха после реакта и всех его массивов зависимостей

    • @PurpleSchool
      @PurpleSchool  Рік тому +2

      Именно!

    • @КонстантинТарасов-к6щ
      @КонстантинТарасов-к6щ Рік тому +1

      Все ещё жду каминаута Абрамова по поводу хуков. С редаксом уже разобрались.

    • @CJIu3eHb
      @CJIu3eHb Рік тому +1

      ​@@КонстантинТарасов-к6щ Сами по себе хуки вещь неплохая по задумке, это композиция, недаром в том же Vue3 подобную вещь назвали Composition API. Другое дело, что этот банан потащил за собой стадо обезьян и все эти джунгли с магией ререндерингов.

    • @КонстантинТарасов-к6щ
      @КонстантинТарасов-к6щ Рік тому +1

      @@CJIu3eHb хуки тащат с собой кучу ненужного оверхеда (deps, rule of hooks), при этом они тормозные. Стейт вверх не поднять без перерендера. Приготовлены исключительно для реакта. И ВСЕГДА ведут к плохому дизайну приложении с логикой в компонентах. Увиденные мной приложения на хуках уже не развидеть.
      Ну а в композиции можно как без хуков, так и без фп.

  • @andyjs666
    @andyjs666 Рік тому +3

    Спасибо! Очень нравится твой подход к разбору технологий.
    У Solid есть один очень существенный недостаток по сравнению с React: это по сути проект одного разработчика. И каким бы не был гениальным Ryan Carniato (он автор Solid), но существует отличная от нуля вероятность, что если по каким-то соображениям он перестанет его поддерживать, то на этом история Solid и закончится.
    Кстати, я экспериментировал с @preact/signals-react. Пока очень сыро. В Next 13 он ломает HMR. И в ишьюсах народ пишет, что не работает с новой папкой app.

    • @PurpleSchool
      @PurpleSchool  Рік тому +1

      Спасибо! Да, сигналы в реакт это пока хаки.

  • @BlexJS
    @BlexJS Рік тому +4

    Спасибо за контент про солид жс❤️
    Незаслуженно непопулярный фреймворк, любою его всем сердцем, жаль работу на нём не найти.
    Хотя preact используют в некоторых специфических сферах, но это больше как исключение

    • @PurpleSchool
      @PurpleSchool  Рік тому

      Да, там сигналы тоже появились.

  • @KuruApni
    @KuruApni Рік тому +11

    Тема с сигналами конечно крутая, но я вижу только одно преимущество. Это точечный рендер.
    Что смутило:
    1. Какие-то игры с реактивностью. Очерденой эксперимент. Мало нам Vue. В RxJS уже все придумано до нас. Из коробки нет банального throttle/debounce, надо ставить solid/primitives.
    2. Когда в return (условной разметке, все понимают о чем я) миксуются структуры вида , у меня пред глазами всплывают болезненные флешбеки со временем PHP древних, когда под wordpress писал. Там такая же мешанина из всего была.
    3. Притензии вида "в реакте надо подписываться\отписываться" ну прям такое. Даже джуны по-хорошему про это должны знать.
    Как итог, фреймвор интересный, но не более. Рискнете выводить в продакшн в b2b, потом будете переписывать на что-нибудь из большйо тройки, как сейчас происходит со многими прошлыми "перспективными" фреймворками. В текущих реалиях залог успеха фреймворка - это не его условны перфоманс или фишка, а комьюнити и поддержка.
    PS. Интересно было бы узнать твое мнение по поводу ангуляра. Или вообщ небольшое видео, где ты влоб но коротко сравниваешь Angular/Vue/React
    Заранее спасибо.

    • @PurpleSchool
      @PurpleSchool  Рік тому +3

      Спасибо за развёрнутый комментарий. В целом согласен, но пока мы не знаем куда он пройдёт дальше. На Svelte тоже люди не ставили, а он растёт. Плюс тут минимальная разница с React, что плюс.
      Angular я люблю и много ранее на нём писал, может видео сделаю. Но сейчас он разве что для больших внутренних проектов подходит.

    • @Slesh2911
      @Slesh2911 Рік тому +2

      Тоже хотел похожий коментарий написать. Но хочу добавить ещё один пункт.
      4. Всю "магию" с автоматическими подписками и точечным ререндером можно реализовать на реакте написав соотвествующие хуки.

    • @nade3282
      @nade3282 Рік тому

      chel, react kal prosto priznay eto

    • @nade3282
      @nade3282 Рік тому

      @@Slesh2911 хапхапхап че за бред, а может тогда вообще на чистом js будем писать? ведь все что есть в реакте можно написать на чистом js xdd

    • @Slesh2911
      @Slesh2911 Рік тому

      @@nade3282 Пишите

  • @wellmare
    @wellmare Рік тому +2

    Круто

  • @moon.trance
    @moon.trance Рік тому +11

    А почему собсна не Vue? Я когда вижу подобное восхищение, что все само обновляется и не надо подписываться, вспоминаю computed из Vue, который еще в 14-м году так работал. Минимум телодвижений - максимум результата. В 3-й версии еще подвезли JSX, улучшенную подержку TS и много всего полезного.

    • @виртуоз_ру
      @виртуоз_ру Рік тому

      Просто эти дауны этого не понимают.

    • @voloduhe
      @voloduhe Рік тому +1

      кажется, во vue слишком мало чистого js, чтобы он стал популярным

    • @nade3282
      @nade3282 Рік тому

      @@voloduhe слишком мало чистого js. что это за выражение? мало чистого js? так идите на ванилу

    • @voloduhe
      @voloduhe Рік тому +1

      @@nade3282 я и так на ваниле, реакт это библиотека

    • @keyboard_brothers
      @keyboard_brothers 11 місяців тому

      ​@@voloduheт. е. Ты не используешь react-dom?)

  • @dergunovalexandr
    @dergunovalexandr Рік тому +4

    Хм. Это очень похоже на Vue3 с jsx. Антон, попробуйте тоже самое написать на Vue. Только лучше без jsx, тогда кода будет ещё меньше и он будет более прост для восприятия.

    • @PurpleSchool
      @PurpleSchool  Рік тому +1

      Не трогал Vue 3 с JSX, гляну

  • @Chantaletecker
    @Chantaletecker Рік тому

    Подскажите название color scheme для NVim, пожалуйста

  • @vovergg
    @vovergg Рік тому +4

    Ну, наконец-то.)) Всегда всем сердцем ненавидел React с его подходом к рендеренгу (ну, не заходит и всё :). Вот, есть же более-менее нормальные подходы.)

    • @PurpleSchool
      @PurpleSchool  Рік тому +1

      Да, это мне тоже очень понравилось в Solid js.

    • @lionstar3189
      @lionstar3189 Рік тому +1

      А чем его подход к рендерингу плох? Он для фейсбука разрабатывался, для больших проектов реакт самое то.

    • @vovergg
      @vovergg Рік тому +1

      @@lionstar3189 Рендеринг не имеет отношения к тому, большой проект или маленький, это просто способ визуализации в браузере. Мне просто не нравится подход визуализации, который реализован в React, потому что там с переходом на хуки стал не полностью явный жизненный цикл компонентов.
      Простыми словами, не всегда понятно, когда именно будет отрисовываться компонент при различных комбинациях зависимостей изменения данных в нём.

    • @lionstar3189
      @lionstar3189 Рік тому +1

      ​@@vovergg В этом случае, да нужно понять как именно работают хуки, но и там можно всё разобрать.
      солид по мне хороший фреймворк, если тебе нужно чисто что то на подобии jquery.
      Если иметь ввиду просто процесс рендеринга, при первом появлении в дом браузера, то тогда солид быстрее сделает. А если у тебя сотни компонентов на странице и их родитель обновляется и нужно так же произвести РЕрендеринг в некоторых(не во всех т.е.) только. То тут только решает фреймворк на подобии реакта, солид в ауте как бы.

    • @виртуоз_ру
      @виртуоз_ру Рік тому

      Нормальных людям реакт нравиться не может. Попробуй Vue 3 и ты забьёшь на всю эту хрень.

  • @ilnurryazhapov
    @ilnurryazhapov Рік тому

    Про сигналы в ангуляре будет видео? уже добавили

  • @sergeydostovalov6180
    @sergeydostovalov6180 10 місяців тому +1

    Короче. Реакт, это как батина Лада Веста: ее могут перебрать в любом гараже, запчасти есть в любом магазине, да ты и сам начинаешь разбираться в строении мотора и ходовки, а ручная коробка передачь поможет выехать из любого говна. Правда ехать на ней по пробкам или на дальняк тяжеловато и кондей может подарить тебе воспаление легких, но ты в ней уверен! Солид жс - это как бэха, ты просто едешь туда куда надо: быстро, с комфортом и думаешь как бы она не сломалась )
    Пс. На самом деле я тоже жду когда разрабы реакта сделают камингаут и сообщат народу, что реакт это шляпа, по типу редакса)

    • @peiiiajikuh
      @peiiiajikuh 4 місяці тому

      Может наоборот, Реакт это бэха, а нативный жс - лада?

    • @sergeydostovalov6180
      @sergeydostovalov6180 4 місяці тому

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

  • @evgeny_mdr
    @evgeny_mdr Рік тому +1

    Можешь дать ссылку на репозиторий твоего конфига для Astronvim?

    • @PurpleSchool
      @PurpleSchool  Рік тому +1

      Он почти дефолтный сейчас, как допилю, выложу и сделаю видео.

  • @awenn2015
    @awenn2015 Рік тому

    23:53 чет магия какая то, сначала data это функция, потом data это уже объект, с Солид не работал поэтому выглядит как то странно, плюс все эти Show какое у них преимущество перед обычной проверкой тернарниками?

    • @Илья-с1л6э
      @Илья-с1л6э 8 місяців тому

      использование Show вместо тернариков обусловлено тем как работают сигналы. С простым тернаринком не будет работать подписка на сигналы

    • @awenn2015
      @awenn2015 8 місяців тому

      @@Илья-с1л6э понял, спасибо

  • @juniornavsegda
    @juniornavsegda Рік тому +7

    Антон, сними пожалуйста новый ролик про ts + react

    • @PurpleSchool
      @PurpleSchool  Рік тому +3

      Хорошо

    • @shava1788
      @shava1788 Рік тому +1

      +++
      На ютубе мало нормальных роликов про типизацию React.

    • @alienspro
      @alienspro Рік тому +1

      @@shava1788 может вам курс у Антона купить по TS? Прерасный курс. И на Udemy TS+React очень много превосходных курсов.

  • @uncle_ara
    @uncle_ara Рік тому +2

    Как называется ваш шрифт?

  • @dsbasko
    @dsbasko Рік тому +4

    А давай тоже самое про vue 3 и\или nuxt3 )

    • @PurpleSchool
      @PurpleSchool  Рік тому +2

      Хорошо, записал на заметку)

  • @akella6084
    @akella6084 8 місяців тому +1

    Самое трудное в Solid - это понять, зачем он нужен, когда есть Vue.)

  • @rudinandrey
    @rudinandrey Рік тому

    попробуйте RiotJS

  • @andykud63
    @andykud63 Рік тому

    Пора уже пилить курс по TS 5...

    • @PurpleSchool
      @PurpleSchool  Рік тому

      Он есть и дополнен особенностями 4.9 и 5.0 purpleschool.ru/course/typescript

    • @andykud63
      @andykud63 Рік тому

      спасибо, Антош, гляну.

  • @artyomvashkevich602
    @artyomvashkevich602 Рік тому +1

    Если честно то очень похоже на svelte но в svelte мне кажется более понятнее реализованно все тоже самое. По этому никого не хочу обидеть, но solid не взлетит т.к. врятле сможет быть похожим на svelte и стать лучше него. Форк svelta как по мне.

    • @PurpleSchool
      @PurpleSchool  Рік тому +1

      Ну не, они прям координатор отличаются и подходом и синтаксисом разметки. Общее - реактивность.

    • @Илья-с1л6э
      @Илья-с1л6э 8 місяців тому

      и вот в свелте тоже добавили сигналы)

  • @uncle_ara
    @uncle_ara Рік тому +1

    Очень печалит, что мало библиотек, которые работают с solidjs.
    А без библиотек, как без рук.

    • @PurpleSchool
      @PurpleSchool  Рік тому

      Это верно

    • @Илья-с1л6э
      @Илья-с1л6э 8 місяців тому

      у solid есть интерсная особеность. Многие библиотеки не нужно под него прям адаптировать, так как весь пласт библиотек написаный под ванильный js могут просто работать) За счет того что нет ререндера компонента как в том же реакте

  • @Endru1994
    @Endru1994 6 місяців тому

    зачем столько фреймворков? вообще пишу ванильно и не парюсь, выработал свои подходы и рад. Только в python - django юзаю как фреймворк, а на php тоже пишу без фреймворков. Это всё субъективно, но первый вопрос актуальный, зачем? Столько фреймворков..

  • @givgiv6688
    @givgiv6688 Рік тому

    солид это реакт в связке с mobx, интересная штука

    • @PurpleSchool
      @PurpleSchool  Рік тому +1

      Очень свежо смотрится

    • @КонстантинТарасов-к6щ
      @КонстантинТарасов-к6щ Рік тому +2

      Mobx интересен в связке с реактом. А вот солид уже можно и без mobx, там концепты сторов и реакций из коробки.
      Итого, минус пару десятков килобайт зависимостей.

  • @ЕвгенийЯкунин-ф2д

    Читаю доки по solid-start... такое ощущения, что с сайта документации remix не переходил)

    • @PurpleSchool
      @PurpleSchool  Рік тому +1

      Да, взяли всё лучшее от других)

    • @ЕвгенийЯкунин-ф2д
      @ЕвгенийЯкунин-ф2д Рік тому +1

      @@PurpleSchool ну и правильно, с одной стороны. Ждем релиза. Спасибо за видео, Антон!

  • @dev_kd
    @dev_kd Рік тому +2

    Хм... это же svelte, только с лишними тело движениями

    • @PurpleSchool
      @PurpleSchool  Рік тому +1

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

    • @Илья-с1л6э
      @Илья-с1л6э Рік тому

      @@user-kfh56gjxt компилятор у solid? Solid использует jsx, там необходим только транспайлер. Но если это считать эквивалентом компилятору то тогда и react "использует" компилятор)

  • @xice111
    @xice111 Рік тому +9

    Не юзайте его, это лютое кусок г, он несколько лет в нпм, и его никто не юзает, потому что он неудобный и не решает всех задач. Само название не даст вам найти что-то в поиске, а будет показывать на принцип solid. Его любят программисты с синдромом гадского утенка, которые хотят быть, не такими как все. Там даже деструктуризацию невозможно сделать. Вы не найдете программиста на нем к себе на галеру.
    Просто посмотрите как работает reconciliation и мемоизация в react, и писать на нем сразу станет понятно и полизводительно

    • @alienspro
      @alienspro Рік тому +5

      @@notrodans вам скрости в React не хватает? Так не закапываейте его в кучу контекстов и следите за ререндером. Оптимизацию своего приложения еще никто не отменял, а комментатор выше прав на 100%

    • @alienspro
      @alienspro Рік тому +5

      Полностью поддерживаю, некоторые программисты просто не полностью используют возможности react

    • @КонстантинТарасов-к6щ
      @КонстантинТарасов-к6щ Рік тому +4

      @@notrodans его любят программисты, которые делают ставку и на UX и на DX. Иначе приходится читать про мемоизацию, изучать реконсиляцию, вручную, прописывать зависимости в массивчик, дрочить на правила хуков, откапывать редух... А когда тебе говорят, что можно без всех этих приседаний, просто говори, что solidjs лютое говно.

    • @xice111
      @xice111 Рік тому

      @@КонстантинТарасов-к6щ в реакте очень простой механизм мемоизации, так и скажи, что всю голову забил не нужными алгоритмами, и не понимаешь как работать на прикладных задачах, которые требует бизнес

    • @Илья-с1л6э
      @Илья-с1л6э Рік тому +4

      ​@@xice111 механизм то простой, но его использование приводит к боли.
      Пример. Есть компонент внутри него есть некая мемоизированая фунцкция, которая зависит от пропсов компонента, среди которых есть не только примитивные значения, а допустим еще и объекты массивы или другие функции.
      Теперь у нас появляется компонент который используется компонент . Теперь компоненту нужно знать что компонент внутри себя что-то мемоизирует, и мемоизировать все нужные пропсы, иначе вся мемоизация компонента теряет смысл, и возможно даже будет во вред.
      То есть компонент должен знать о том как реализован компонента внутри, что явно говорит о проблеме в коде. Зависить от интерфейса компонента - ок. Зависит от внутренней реализации не ок.
      Теперь добавляем еще компонент который использует . И может сложится такая ситуация что компонент тоже должен быть обмазан мемоизаций потому что комопнент внутри себя использует компонент , о котором компонент вообще не знает.
      То есть мы можем прийти к ситуации что нам нужно просто все приложение обмазывать мемоизацией. Мало того что это бьет по DX, так еще и любая мемоизация не бесплатна, а значит увеличивая кол-во мемоизаций, мы можем прийти к тому что вся мемоизация жрет ресурсов не сильно меньше чем изначальный проблемный компонент без мемоизации. И когда именно настанет такой момент предсказать не то чтобы легко.
      P.S. данный кейс относится к больше к проектам, где реакт используют именно как полноценный фреймворк а не ui либу. То есть строя на нем свое приложение. Описывая всю логику в хуках, затаскивая react-query и react-rotuer связывая их именно через реакт.
      Лично я сам мемоизацию использую крайне редко, так. как всю логику я держу вне реакта. Но проектов которые используют описаный выше подход достаточно много и подобные проболемы с мемоизацией я встречал там достаточно частно. И либо мемоизация теряла смысл, так как один родительстких компонентов не использовал мемоизацию либо/или/и весь код превращался в сплошную кашу из useMemo/useCallback

  • @alienspro
    @alienspro Рік тому +4

    Может и свежо, но миллионы проектов на React + TS не будет никто переписывать и продолжат использовать реакт для доработок. Дорого и не эффективно.

    • @m.kolomoyets
      @m.kolomoyets Рік тому +5

      Когда-то так говорили про jQuery. Признаю, на нем еще пишут до сих пор))) но ситуация какая сейчас есть)

    • @PurpleSchool
      @PurpleSchool  Рік тому +2

      Переписывать нет, но может свежие проекты, где производительность критична могут начать, так как переход от React минимален.

    • @КонстантинТарасов-к6щ
      @КонстантинТарасов-к6щ Рік тому +4

      Пособолезнуем нафигачившим на хуках и редаксах приложений. Пусть поддерживают и страдают.

    • @alienspro
      @alienspro Рік тому +2

      @@m.kolomoyets jQuery не обладал даже долей возможностей React, переход был вполне логичен, ведь началось все еще с Backbone и первого Angular

    • @alienspro
      @alienspro Рік тому +2

      @@КонстантинТарасов-к6щ пишу на React больше 5 лет, посление 4 + TS, страданий не обнаружил. От классов страдал только малость.

  • @MELkey3
    @MELkey3 Рік тому +2

    limit не значение, а функция .. блин ну тогда так и пиши [getLimit, setLimit] = createSignal

  • @wh1te26
    @wh1te26 Рік тому

    Реакт - это не фреймворк... Правильно - вИт, а не вАЙт
    контент не в кайф после такого

    • @PurpleSchool
      @PurpleSchool  Рік тому

      Я в курсе, что он не фреймворк, но выбирать ты будешь между Angular, Vue и сборкой с React, так что, то что на сайте у него написано, что он библиотека, не мешает его сравнивать с фреймворками.

    • @nade3282
      @nade3282 Рік тому

      правильно вИт, клоун

  • @OleksiiMalichenko
    @OleksiiMalichenko Рік тому

    А с каких пор реакт позиционируется как фреймворк? 1:52

    • @PurpleSchool
      @PurpleSchool  Рік тому +6

      Да, он библиотека. Но когда ты выбираешь на чем писать ты сравниваешь Angular, React, Vue или что-то ещё. И фактически собирая React + Router + остальное получаешь фреймворк.

    • @anatoliiilescu839
      @anatoliiilescu839 Рік тому

      это все что ты понял...скажи спасибо автору , неблагодарный п**д*к

    • @lionstar3189
      @lionstar3189 Рік тому +1

      сам реакт это биба. С реакт-дом уже фреймворк. Зачастую это и имеют ввиду уже.

  • @starwalker.odessa
    @starwalker.odessa Рік тому

    Очередная "гениальная" хрень? Angular, Vue, React - уже пришли в творческий (и технический) тупик! Пора еще одну херню сделать! Ииииитак - встречаем SOLID JS! Еще один гвоздь, который через пару лет даже гвоздодером не вытащить.
    А может хватит уже плодить абстракции? От всего этого говна уже и так тесно.

    • @PurpleSchool
      @PurpleSchool  Рік тому

      Давайте писать на чистом JS? Как вы не понимаете, что любая новая реализованная концепция в очередном фреймворке это новый шаг развития Frontend. А то бы мы сейчас до сих пор на jQuery элементы выбирали, не имея полноценные приложения на фронте.

    • @starwalker.odessa
      @starwalker.odessa Рік тому

      @@PurpleSchool А кто говорил об этом? Давайте допиливать пару основных фреймворков - а не велосипедить новые?!

    • @ЕвгенийАфанасьев-о5у
      @ЕвгенийАфанасьев-о5у Рік тому

      @@starwalker.odessa Такой интересный ты. Сколько PR в основные модули React/Angular/Vue сделал ? Дай угадаю, 0, зато первый в очереди на указания для сообщества. У каждого мейнтейнера есть свой взгляд на то как должна решаться та или иная проблема. Новые фреймворки пишут не потому что людям делать нечего, а потому что каждый по своему считает как делать ту или иную функцию правильно. Фейсбук решил, что виртуальный DOM это правильно, svelte и solid решили, что это оверхед. Ну и в конце концов это open source. Тебе тут никто ничего не должен. Open source не означает вторую работу, где нужно реализовывать хотелки заказчика. Там ребята реализуют себя, а тебе дают возможность попробовать или внести свой вклад в эту же идею

  • @EntrataAstrales
    @EntrataAstrales 9 місяців тому

    очередная пропаганда typescript

    • @PurpleSchool
      @PurpleSchool  9 місяців тому

      Ему не нужна пропаганда, это по факту стандарт разработки

  • @виртуоз_ру
    @виртуоз_ру Рік тому +1

    Всё это говно. Лучше всех это Vue и Nuxt

    • @nade3282
      @nade3282 Рік тому

      смотря для каких задач, solid на порядок меньше весит чем vue

    • @starwalker.odessa
      @starwalker.odessa Рік тому

      Кого - всех? Лучше чем - что? В каких случаях? Может у тебя код - говно, потому что получается только на Vue?

    • @виртуоз_ру
      @виртуоз_ру Рік тому

      @@starwalker.odessa Дура, если ты не понимаешь того, что реакт говно, то с тобой не о чем вести диалог.

    • @nade3282
      @nade3282 Рік тому

      @@starwalker.odessa АПХАПХАПХ ты че конченый?