mobx-react добавляет shouldComponentUpdate в каждый компонент и тотчечно обновляет только то что надо

Проверка глубокая?

PureComponent?

Проверка глубокая?

Без проверок, стейт сам реактивный. Грубо говоря, компонент в момент рендера обращается к частям стейта, mobx трекает обращение и в следующий раз при изменении только того, к чему обратился компонент, обновляет его

Если кому нужно, написал либу для себя. Библиотека переключает элементы на веб-странице. весит 3кб в минифицированном виде. Скоро обновлю ее, должна весить еще меньше. Для использования нужно установить табы и блоки, последнее впрочем не обязательно. Табы/блоки (можно использовать для SPA-приложений, таб как ссылка, блок как страница, при нажатии на таб переключается блок) и просто табы без блоков, например для переключения языка en/rus/de. Используется один обработчик событий на коллекцию NodeList (например на множество элементов "<li></li>") и внутренне кеширование (что ранее было включено то и отключается), тем самым минимизируется обращение к DOM. Так же можно к одиночном элементу привязать (к id или любому другому тегу или классу) и расположить произвольно на странице. Можно еще сделать так, чтобы при активации одно таба/блока, все остальные экземпляры с табами и блоками закрывались, или добавить комбинации, которые поваляют закрывать одни и не трогать другие. Подробно в readme и в примерах. Читать лучше последовательно. Примеры: https://artnv.github.io/switcher/index.html github: https://github.com/artnv/switcher

а какое отношение к реакту имеет? )

А, просто дом. Ну ок.

видимо демонстрация того какие извращения приходится делать без реакта

mobx-react добавляет shouldComponentUpdate в каждый компонент и тотчечно обновляет только то что надо

это звучит ужасно

Если кому нужно, написал либу для себя. Библиотека переключает элементы на веб-странице. весит 3кб в минифицированном виде. Скоро обновлю ее, должна весить еще меньше. Для использования нужно установить табы и блоки, последнее впрочем не обязательно. Табы/блоки (можно использовать для SPA-приложений, таб как ссылка, блок как страница, при нажатии на таб переключается блок) и просто табы без блоков, например для переключения языка en/rus/de. Используется один обработчик событий на коллекцию NodeList (например на множество элементов "<li></li>") и внутренне кеширование (что ранее было включено то и отключается), тем самым минимизируется обращение к DOM. Так же можно к одиночном элементу привязать (к id или любому другому тегу или классу) и расположить произвольно на странице. Можно еще сделать так, чтобы при активации одно таба/блока, все остальные экземпляры с табами и блоками закрывались, или добавить комбинации, которые поваляют закрывать одни и не трогать другие. Подробно в readme и в примерах. Читать лучше последовательно. Примеры: https://artnv.github.io/switcher/index.html github: https://github.com/artnv/switcher

?

Покажите быстрые сайты на реакте), Я как не зайду на сайт, вижу гуризится чуть ли не минуту, тормозит при переключении, открываю код и вижу "реакт".

например kp.ru

это же ужос, визуально можно сделать в 50кб кода макимум

fb? :)

kp.ru о, загрузился за 2.6 минут))

anews.com

если бы увидел, то наверн использовал бы

но там серверный ррендеринг

Покажите быстрые сайты на реакте), Я как не зайду на сайт, вижу гуризится чуть ли не минуту, тормозит при переключении, открываю код и вижу "реакт".

meduza.io

kp.ru о, загрузился за 2.6 минут))

за 10 сек загрузился, хз

без кеша

SoundCloud

это звучит ужасно

На самом деле, нет

сама страница отадалась меньше чем за секунду, дальше всякая статика

а че его прям трясет при скроллинге, прям рывками

причем скроллинг по ранее полученным данным

Покажите быстрые сайты на реакте), Я как не зайду на сайт, вижу гуризится чуть ли не минуту, тормозит при переключении, открываю код и вижу "реакт".

pochta.ru

это звучит ужасно

Только звучит, у меня первые впечатления были такие же. Ровно до того раза, когда я потратил несколько часов на написание *сложных* should component update.

а бек-енд у них node?

это звучит ужасно

Вот статья, которую не устану приводить в качестве пруфа: https://habrahabr.ru/post/304340/ (читать до конца)

Там просто картинок очень много

а с другими библиотеками как реакт использовать?

например всякие d3 с графиками

они то с DOM работают

Что то типо того: http://www.reactd3.org/

Но они как то забросили проект(

Вот статья, которую не устану приводить в качестве пруфа: https://habrahabr.ru/post/304340/ (читать до конца)

круто, ускоряем точечные апдейты на пару мс когда нет ниодного фрэйм дропа и добавляем оверхэд на построение графа зависимостей во время тяжелых create/delete :)

просто инжектить в div результат или как-то по умному реакт дружит с обычными либами?)

круто, ускоряем точечные апдейты на пару мс когда нет ниодного фрэйм дропа и добавляем оверхэд на построение графа зависимостей во время тяжелых create/delete :)

То есть ты посчитал уже оверхед, который mobx добавляет?

просто инжектить в div результат или как-то по умному реакт дружит с обычными либами?)

что есть "обычная либа"?

То есть ты посчитал уже оверхед, который mobx добавляет?

нет, но я уверен что ты посчитал и сейчас продемонстрируешь что я не прав :D

нет, но я уверен что ты посчитал и сейчас продемонстрируешь что я не прав :D

Я не считал :) Я просто посмотрел бенчмарки)

что есть "обычная либа"?

jquery, leafet для работы с картами, яндекс апи карт, и прочее прочее

которые с DOM работают

jquery, leafet для работы с картами, яндекс апи карт, и прочее прочее

интересно где грань)

Грань после первого слова)

так как?

вот допустим пример https://www.flightradar24.com/

каждая страница будет с разным модулем которая использует свою библиотеку. Как бы вы ее сделали с реактом?

Если хорошая фантазия и ты умеешь хорошо жанглировать в голове состоянием приложения, то можно любую из них использовать

Но это будет очень больно, страшно и плохо

в итоге приходим к обычному программированию на js?)

без реакта

Нет, мы берём всё что на JQuery, etc... и переписываем на реакт

В целом, как показывает практика, все эти свистелки перделки: a) не нужны б) легко переписываются под нужды проекта

Некоторые вещи не обязательно переписывать, просто не понятна грань

Если либа что - то меняет в доме, то есть вероятность, при изменении стейта приложения, что твой элемент уже будет обращаться к несуществующему компоненту

Вернее твоя либа

Не элемент

ну а если серьезно. В каждом окне используется своя либа, в одном - жкуери для анимации, формы и фотогаллерея, во втором тяжеловесная для работы с картами, во втором библиотека UI какой-нибудь CRM, в третим для работы графиками, в четвертом реалтайм инфа, сводки и тд, чат и проче

и все эти либы по жесткому используют DOM, как быть?

Возможно реакт в данном случае не подходит

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

и все эти либы по жесткому используют DOM, как быть?

искать другую работу

вооо, заметил!

Реакт - это не серебрянная пуля

ERROR: S client not available

и тут приходит моя либа на помощь))))))))))))))))))

пздц

И что за либа?

опа https://artnv.github.io/switcher/

???

она умеет только табы?

tab-only?

да в описании там много чего

И зачем?

Что бы было!

Я могу и без неё впихнуть реакт в отдельный DOM элемент, а JQuery в другой

Потому что может!

да если и без моей, но вообще придется на чистом ведь писать?

обосрать либы и пропихнуть свою

Нет

Я могу и без неё впихнуть реакт в отдельный DOM элемент, а JQuery в другой

Я так постоянно делаю. Класический сайт и пихаю в React

а что будет если заказчик захочет новую фитчу вставить или дополнить функционал, а весь проект полностью на реакте и прям большоооой

и что делать в таком случае?

а что будет если заказчик захочет новую фитчу вставить или дополнить функционал, а весь проект полностью на реакте и прям большоооой

И?

использовать твою либу конечно же

Вставляешь новую фитчу в отдельный DOM элемент, который не обновляется

Оконечников продает свой контрибуторский тикет на реакт европ

они по 200 евро были вроде

https://twitter.com/okonetchnikov/status/864043327217430529

налейтай

В реакте, можно сказать, не обновляй этот компонент

ща тикеты только по 2к евро

Внутри функции shouldUpdate

А онлайн трансляция будет?

хз

я и в том году там на месте был

@artnv Не подумай, что мы злые, просто она не нужна)