@react_js
React — русскоговорящее сообщество

Обсуждаем React.js и экосистему. См. также: @reactnative_ru, @apollo_ru, @protonnative_ru, @nodejs_ru, @js_ru, @uiux_ru Вакансии и поиск работы: @javascript_jobs Правила: http://bit.ly/our_etiquette Sponsored with ❤️ by www.axept.co

5822 members

Архив канала @react_js 16 мая 2016 г.

06:41:08 ДП
User 202047214
Немного оффтопик, но может кто-то знает сервис, который умеет отдавать json моки и фильтровать их через гет параметры? Что-нибудь типа https://github.com/typicode/json-server , но чтобы не поднимать у себя
github.com/typicode/json-server
Get a full fake REST API with zero coding in less than 30 seconds (seriously) - typicode/json-server
06:52:10 ДП
User 152745946
http://jsonplaceholder.typicode.com
06:52:18 ДП
User 152745946
1 ссылка в гугле)
06:55:04 ДП
User 143141567
Один и тот же создатель)
06:55:04 ДП
User 143141567
Немного оффтопик, но может кто-то знает сервис, который умеет отдавать json моки и фильтровать их через гет параметры? Что-нибудь типа https://github.com/typicode/json-server , но чтобы не поднимать у себя
github.com/typicode/json-server
Get a full fake REST API with zero coding in less than 30 seconds (seriously) - typicode/json-server
06:55:04 ДП
User 143141567
http://jsonplaceholder.typicode.com
07:03:44 ДП
User 202047214
Там несколько ссылок с готовыми данными, а для своих предлагают поставить json-server себе)
07:04:39 ДП
User 152745946
эм)) ну вот тебе еще вариант. https://api.github.com
07:21:54 ДП
User 108543364
User 108543364
А кто normalizr пользуется, расскажите как вы подчищаете хранилище
отрыл один issue на гитхабе https://github.com/reactjs/redux/issues/644
Вообщем ничего из коробки редакс, как я понял, не предлагает. Интересно, как пишутся всякие мессенджеры на нем и подчищаются при этом данные.
github.com/reactjs/redux/issues/644
I'm making really great progress having taken the real-world example and gotten it working with my own app's remote data, including session information, listing several collections, and displaying ...
07:25:25 ДП
User 108543364
User 108543364
отрыл один issue на гитхабе https://github.com/reactjs/redux/issues/644
Вообщем ничего из коробки редакс, как я понял, не предлагает. Интересно, как пишутся всякие мессенджеры на нем и подчищаются при этом данные.
github.com/reactjs/redux/issues/644
I'm making really great progress having taken the real-world example and gotten it working with my own app's remote data, including session information, listing several collections, and displaying ...
@gusnkt ты же вроде мессенджер пишешь? :)
07:26:25 ДП
User 775925
Как пример можно приписывать дату к объектам при добавлении их в стор. И при критическом объеме стора, вычищать старые объекты.
07:26:51 ДП
User 108543364
User 775925
Как пример можно приписывать дату к объектам при добавлении их в стор. И при критическом объеме стора, вычищать старые объекты.
это очень не надежно
07:27:06 ДП
User 108543364
да и какую дату? я например могу старые сообщения смотреть
07:27:27 ДП
User 108543364
если только сделать какую то обертку и делать mapStateToProps через нее
07:27:42 ДП
User 108543364
и записывать ts маппинга
07:40:05 ДП
User 152745946
User 108543364
@gusnkt ты же вроде мессенджер пишешь? :)
Угу
07:40:31 ДП
User 108543364
User 152745946
Угу
А расскажи ваше датафлоу с данными, как их подчищаете
07:41:06 ДП
User 108543364
храните ли все сообщения нормализованными?
07:43:57 ДП
User 152745946
Ох, там сложно) у нас есть сервер, есть протокол и клиентская либа на Java, которая под платформы компилится. Там вся работа с данными и проходит
07:44:23 ДП
User 108543364
User 152745946
Ох, там сложно) у нас есть сервер, есть протокол и клиентская либа на Java, которая под платформы компилится. Там вся работа с данными и проходит
мне только клиент)
07:44:29 ДП
User 108543364
мне сервер не интересен
07:45:16 ДП
User 108543364
что делаете, чтобы за неделю работы с открытым табом, браузер не сдох)
07:48:03 ДП
User 152745946
так вот вся работа с данными в библиотеке происходит, а flux+react только отрисовывает, в основном
07:48:21 ДП
User 185980313
профилирование и отлавливание утечек памяти?
07:49:31 ДП
User 108543364
User 152745946
так вот вся работа с данными в библиотеке происходит, а flux+react только отрисовывает, в основном
т.е. ничего не нормализуете? все сообщения в какой то одной переменной (массиве) хранятся в сторе?
07:49:58 ДП
User 152745946
по сути да
07:51:08 ДП
User 152745946
в библиотеке достаточно умно переиспользуются все объекты
07:51:39 ДП
User 152745946
однако v8 течет, остальные движки еще хуже, так что память - да, это проблема
07:51:40 ДП
User 108543364
т.е. например нельзя открыть одновременно вьюхи с двумя чатами?
07:52:20 ДП
User 152745946
мм, в приложении такого не предусмотрено. но и зачем такое?
07:52:26 ДП
User 152745946
чтобы был split-screen?
07:52:38 ДП
07:53:28 ДП
User 152745946
вообще мы можем такое сделать)
07:53:49 ДП
User 152745946
скорее всего, хотя потребуются правки в логике библиотеки. Но не ясно зачем такое
07:56:57 ДП
User 152745946
вообще на сколько я знаю, как у нас реализовано. При старте приложения клиент получает все группы и всех юзеров, с которыми есть чаты. При такой логике сообщения скорее всего могут приходить с id sender, а не полным объектом. Ты про эту нормализацию?
08:06:13 ДП
User 108543364
я скорее про то, чтобы без боли можно было делать рекурсивные вьюхи (без ограничение на кол-во переменных в сторе, которые хранят мессаги)
08:14:18 ДП
User 213704994
А сейчас react-id как-то узнать можно? В DOM уже не видно, в RDT тоже не нашел
08:14:35 ДП
User 775925
Правильно ли я понимаю, что есть такая ситуация. В сторе хранятся сообщения следующим образом:

messages: {[id: string]: Message}

При этом хочется иметь какой-то мусоросборщик который ограничивал бы максимальное количество сообщений в сторе?
08:15:55 ДП
User 775925
Руслан, зачем вообще может потребоваться знать react-id?
08:27:25 ДП
User 152745946
я могу 1 применение точно придумать. react-addons-perf
08:34:58 ДП
User 213704994
Да, изучал лог printOperations, хотел проверить причину изменения атрибутов
08:35:34 ДП
User 213704994
printOperations из react-addons-perf
08:37:27 ДП
User 213704994
printOperations - это бывший printDOM
08:39:37 ДП
User 213704994
в логах есть куча операций типа
993   "202"  "remove attribute""["disabled"]"
994   "202"  "update attribute""["disabled",false]"
995   "203"  "remove attribute""["selected"]"
996   "203"  "update attribute""["selected",false]"
997   "203"  "update attribute""["value",307]"
998   "203"  "remove attribute""["disabled"]"
999   "203"   "update attribute""["disabled",false]"
09:10:24 ДП
User 108543364
User 775925
Правильно ли я понимаю, что есть такая ситуация. В сторе хранятся сообщения следующим образом:

messages: {[id: string]: Message}

При этом хочется иметь какой-то мусоросборщик который ограничивал бы максимальное количество сообщений в сторе?
Не ограничивал, а подчищал не нужные (которые не используются в UI)
09:12:27 ДП
User 775925
Довольно интересная задачка получается (:
09:16:49 ДП
User 775925
У каждого сообщения должен быть счетчик во скольких вьюшках оно используется. При достижении счетчика нуля, необходимо удалить его из стора.
Надо будет заморочиться за такую штуку (: Спасибо за идею! Буду думать
09:24:12 ДП
User 108543364
User 775925
У каждого сообщения должен быть счетчик во скольких вьюшках оно используется. При достижении счетчика нуля, необходимо удалить его из стора.
Надо будет заморочиться за такую штуку (: Спасибо за идею! Буду думать
можно не удалять а переносить в localStorage например
09:25:07 ДП
User 775925
а тут могут появиться проблемы при превышения максимального размера ls - но это уже совсем другая задача
09:25:41 ДП
User 152745946
ну вот у нас такая проблема была как раз)
09:26:25 ДП
User 152745946
хорошо бы сразу закладывать асинхронность
09:26:40 ДП
User 152745946
тогда можно с localStorage переключиться на indexedDB/WebSQL
09:29:52 ДП
User 213704994
но indexedDB - это IE10+, если это важно
09:30:35 ДП
User 152745946
fallback - localstorage
09:42:10 ДП
User 124386122
User 108543364
Не ограничивал, а подчищал не нужные (которые не используются в UI)
для этого должна быть логика частичного восстановления стейта из внешнего хранилища (стейта), а это в общем случае очень нетривиально делать эффективно. 
Есть у тебя три сообщения [msg1,msg2,msg3], первое и третье испольуется, второе нет, ты его удалил, потом скролл проехал и внезапно тебе его надо показать. И ты в общем случае не знаешь, сколько их там, почищенных - одно или 800. и таких "дырок" в данных может быть много. и разнообразных данных и коллекций тоже. Оно будет достаточно сложно даже на примитивных данных, не говоря уже о сложном приложении. 
Подход утопичен, имхо. В качестве оптимизаций в конкретных кейсах можно, но там обычно находятся гораздо более простые варианты. 
Идея сохранять в ls/indexdb выглядит прикольной но бессмысленной ) неясно, чем там лучше хранить данные чем в стейте аппы непосредственно в js-объектах
09:43:13 ДП
User 108543364
User 124386122
для этого должна быть логика частичного восстановления стейта из внешнего хранилища (стейта), а это в общем случае очень нетривиально делать эффективно. 
Есть у тебя три сообщения [msg1,msg2,msg3], первое и третье испольуется, второе нет, ты его удалил, потом скролл проехал и внезапно тебе его надо показать. И ты в общем случае не знаешь, сколько их там, почищенных - одно или 800. и таких "дырок" в данных может быть много. и разнообразных данных и коллекций тоже. Оно будет достаточно сложно даже на примитивных данных, не говоря уже о сложном приложении. 
Подход утопичен, имхо. В качестве оптимизаций в конкретных кейсах можно, но там обычно находятся гораздо более простые варианты. 
Идея сохранять в ls/indexdb выглядит прикольной но бессмысленной ) неясно, чем там лучше хранить данные чем в стейте аппы непосредственно в js-объектах
при скролле данные должны подгружаться с сервера, и восстанавливать себя в сторе
09:43:56 ДП
User 152745946
это ты в идеальном мире)
09:44:32 ДП
User 152745946
если пользователь отскроллил только что месяц переписки, переключил чат, у заехал в тоннель, и ты ему не показываешь чат - ты идешь в жопу)
09:46:06 ДП
User 152745946
> Идея сохранять в ls/indexdb выглядит прикольной но бессмысленной ) неясно, чем там лучше хранить данные чем в стейте аппы непосредственно в js-объектах

Все та же оффлайновость
09:46:51 ДП
User 152745946
так метеор работает, например. У них внутри фронта мини-монго. И это очень круто
09:47:24 ДП
User 124386122
User 108543364
при скролле данные должны подгружаться с сервера, и восстанавливать себя в сторе
я об этом и написал вообщем-то.
09:49:05 ДП
User 108543364
User 152745946
если пользователь отскроллил только что месяц переписки, переключил чат, у заехал в тоннель, и ты ему не показываешь чат - ты идешь в жопу)
Это должно решаться на уровени либ управления данными типа Amelisa или Breeze
09:49:07 ДП
User 124386122
User 152745946
> Идея сохранять в ls/indexdb выглядит прикольной но бессмысленной ) неясно, чем там лучше хранить данные чем в стейте аппы непосредственно в js-объектах

Все та же оффлайновость
Оффлайновость это другая тема. Там все нужно. 

А как это помогает чистить стейт от старых и уже ненужных объектов - неясно.
09:49:36 ДП
User 152745946
нельзя эти проблемы решать отдельно друг от друга)
09:50:03 ДП
User 152745946
есть данные, которые всегда нужны приложению
09:50:27 ДП
User 152745946
все юзеры, с которыми потенциально может быть переписка, например
10:16:08 ДП
User 141822776
Я думал над проблемой очистки не нужных данных на клиенте в рамках амелисы. В ней тоже, как в метеоре есть возможность выполнять монго-запросы к данным на клиенте. Пока что мысль дошла до того, чтобы сделать api для удаления данных по монго-запросам, которое дергается из бизнес-логики.
Проблема отсутсвующих данных на клиенте решается таким способом - запрос сначала применяется к локальным данным, потом id-шки документов летят на сервер, сервер применяет запрос к базе, вытаскивает документы, сравнивает id-шки, шлёт на клиент разницу. Можно на уровне api конфигурировать для каждого случая - можно ли рендерить сразу (из клиентских данных) или дождаться серверных.
10:18:42 ДП
User 165839224
Вот скажите
10:18:51 ДП
User 165839224
Кто-то писал биткойн майнер на жабаскрипте?
10:19:34 ДП
User 146732672
Майнер?
10:20:19 ДП
User 124386122
Зачем?
10:20:24 ДП
User 141822776
даёшь биткойн майнер в каждом браузере?
10:20:26 ДП
User 68520717
https://github.com/mappum/webcoin
github.com/mappum/webcoin
webcoin - :globe_with_meridians::moneybag: SPV Bitcoin client for Node.js and the browser
10:20:41 ДП
User 146732672
https://github.com/search?l=JavaScript&q=bitcoin+miner&ref=searchresults&type=Repositories&utf8=%E2%9C%93
github.com/search?l=JavaScript&q=bitcoin+miner&type=Repositories&utf8=%E2%9C%93
GitHub is where people build software. More than 14 million people use GitHub to discover, fork, and contribute to over 35 million projects.
10:22:13 ДП
User 146732672
User 68520717
https://github.com/mappum/webcoin
github.com/mappum/webcoin
webcoin - :globe_with_meridians::moneybag: SPV Bitcoin client for Node.js and the browser
разве майнить может?
10:31:17 ДП
User 36499356
го теперь ethereum майнер в браузере
10:34:52 ДП
10:35:07 ДП
User 165839224
Это же золотая жила
10:35:13 ДП
User 165839224
Нынешние сайты и так лагают
10:35:19 ДП
User 165839224
Встрой майнер никто не заметит
10:35:34 ДП
User 68520717
это бесмыссленно
10:35:45 ДП
10:35:48 ДП
10:36:18 ДП
10:36:28 ДП
User 36499356
попробуй)
10:36:29 ДП
User 68520717
бобук ещё год назад говорил, что если запустить майнер на кластере всех серверов яндекса, то намайнится 0, ноль
10:36:50 ДП
User 36499356
не обязательно же биток майнить
10:36:51 ДП
10:37:00 ДП
User 165839224
Я про Etherum к примеру
10:37:10 ДП
10:37:19 ДП
User 68520717
вы думаете что на ваших маленьких сайтах с посещаемостью <1k что-то намайнится?
10:37:29 ДП
User 165839224
РЕКЛАМНАЯ СЕТЬ
10:37:44 ДП
User 165839224
В баннер же позволяют жабаскрипт
10:37:50 ДП
User 165839224
Похуй на клики
10:38:02 ДП
User 68520717
О БОЖЕ
10:38:03 ДП
User 165839224
Майнить будет
10:38:06 ДП
User 68520717
не выгорит
10:38:29 ДП
User 165839224
ПОЧЕМУ?
10:39:04 ДП
User 68520717
мощности всё равно не хватит
10:39:08 ДП
10:39:12 ДП
User 165839224
Почему?
10:39:18 ДП
User 36499356
давайте посчитаем сколько нужно мощности
10:39:18 ДП
User 68520717
плюс как ты это через код-ревью протащищь?
10:39:43 ДП
User 36499356
я могу засунуть в одно приложение на RN и никто не заметит ;)
10:39:47 ДП
User 165839224
Юзать надо вебгл
10:39:57 ДП
User 165839224
Можно лоадер написать
10:40:02 ДП
User 165839224
Обфусифицированный
10:40:13 ДП
User 165839224
И всунуть куда-то глубоко
10:40:19 ДП
User 165839224
В одну из либ
10:40:25 ДП
User 36499356
думаю мощности топовых айфонов должно хватить чтобы мне эфирку намайнить
10:41:05 ДП
User 165839224
А там будут и ПК
10:41:07 ДП
User 165839224
И много
10:41:19 ДП
User 165839224
И вообще
10:41:32 ДП
User 165839224
Рекламщики разве делают кодревью для баннеров?
10:43:28 ДП
10:43:56 ДП
User 201342436
Типа вне темы нельзя спрашивать?)
10:44:03 ДП
User 4627228
А кто ещё на Holy.js собирается, кроме Славы? :)
10:44:08 ДП
User 165839224
Рекламщики разве делают кодревью для баннеров?
10:44:27 ДП
User 201342436
Не понял вопроса)
10:44:31 ДП
User 39182759
о, эту ветку я тоже с удовольстием потер бы:)
10:45:01 ДП
User 201342436
злые вы)
10:45:14 ДП
User 165839224
Почему же не по теме эта ветка?
10:45:32 ДП
User 146732672
Если ты на реакте писать будешь, то можно спрашивать
10:45:51 ДП
User 201342436
Буду когда нужен будет)
10:45:52 ДП
User 36499356
потому что всем известно что лучшая ось для веба — mac os
10:46:01 ДП
User 201342436
основы бы еще хватануть)
10:46:02 ДП
User 165839224
А где чатик про простой жабаскрипт?
10:46:03 ДП
User 146732672
User 36499356
потому что всем известно что лучшая ось для веба — mac os
Навязанная точка зрения
10:46:10 ДП
User 201342436
User 36499356
потому что всем известно что лучшая ось для веба — mac os
не мажер, извольте)
10:47:42 ДП
User 4627228
User 201342436
злые вы)
Вот здесь лучше спроси про Linux для десктоп @ru_ubuntu
10:48:02 ДП
User 201342436
по названию там все за бубунту, спасибо за чат)
10:52:01 ДП
User 185980313
а не нужен будет скетч или фотошоп? Может лучше вообще поставить хакинтош ?)
10:54:25 ДП
User 4627228
Кстати, направляю в русло темы группы - кто-нибудь пробовал поднимать на других ОС (Windows/Linux) виртуалки с OS X, чтобы там iPhone Simulator запускать?
10:54:33 ДП
User 4627228
Как это по производительности?
10:54:56 ДП
User 4627228
Или писать на React Native могут только обладатели Mac*?
10:57:22 ДП
User 185980313
пробовал, эмулятор нормально работал как и сама ос на винде с vmware
10:58:23 ДП
User 4627228
И код собирался быстро? У тебя IDE была тоже внутри запущена?
11:00:22 ДП
User 185980313
нет, использовал только для сборки и тестирования. Нужен был для phonegap, особо проблем тогда не заметил. По поводу скорости, небыло с чем сравнить, но вменяемое время было)
11:31:38 ДП
User 4627228
Парни, есть кому что рассказать про Node.js, tools, isomorphic JavaScript? Давайте соберёмся в четверг вечером http://www.meetup.com/Moscow-NodeJS-Meetup/events/231141123/
meetup.com/Moscow-NodeJS-Meetup/events/231141123
Вышла шестая нода, а мы начинаем шестой митап чтобы обсудить у кого что сломалось. Приятная атмосфера, дружная компания, интересные обсуждения, вообще, всё как обычно.
11:40:35 ДП
User 151893222
а можно прийти и поспрашивать про нагрузки и кто как готовит server side render  c реактом? интересует именно производительность приложенек и кто как выжимает побольше))
11:45:58 ДП
User 4627228
Давай
11:46:10 ДП
User 4627228
Я как раз осенью про это выступал :)
11:46:25 ДП
User 4627228
на HighLoad++ 2015
11:46:57 ДП
User 4627228
Парни, подскажите инструмент для презентаций из Markdown?
11:47:22 ДП
User 68520717
https://github.com/jdan/cleaver
github.com/jdan/cleaver
cleaver - 30-second slideshows for hackers
11:47:31 ДП
User 151893222
Пилим react с ssr, выжать удалось 450rps на адекватных таймингах, но там магия и колдунство с редисом, чтобы не компилить каждый раз шаблоны реакта.
11:50:35 ДП
User 4627228
Может тогда ты и расскажешь про свой опыт?
11:50:38 ДП
User 4627228
Как сделали :)
11:50:44 ДП
User 4627228
Слайдов 10
11:51:22 ДП
User 151893222
Давай, было бы интересно обсудить
12:20:45 ПП
User 4627228
Парни, можете пока регистрироваться - площадку подбираем.
12:34:32 ПП
User 185980313
User 4627228
Парни, можете пока регистрироваться - площадку подбираем.
А по реакту такого формата бывает?
12:35:04 ПП
User 4627228
MoscowJS :) но сделаем и по React.js
12:35:10 ПП
User 4627228
Осенью проводили
12:36:55 ПП
User 152745946
User 151893222
Пилим react с ssr, выжать удалось 450rps на адекватных таймингах, но там магия и колдунство с редисом, чтобы не компилить каждый раз шаблоны реакта.
Пробовали хешик подсовывать реакту который root-id?
01:08:37 ПП
User 118628034
Folks, а есть какой-нибудь диалект над JavaScript для простых смертных, аналог JQL (в Jira: "Project = JRA AND resolution = Fixed") – нужно решать точно такую же задачу - писать на простом понятном языке запросы которые будут транслироваться в js-конструкции
01:21:58 ПП
User 47983686
rкуда проще js-а то?
01:22:13 ПП
User 47983686
ну берешь фреймворк и пишешь на диалекте фреймворка если
01:23:08 ПП
User 4627228
User 118628034
Folks, а есть какой-нибудь диалект над JavaScript для простых смертных, аналог JQL (в Jira: "Project = JRA AND resolution = Fixed") – нужно решать точно такую же задачу - писать на простом понятном языке запросы которые будут транслироваться в js-конструкции
Слав, если спроецировать в развитие фич и рост потребностей - не создаст ли это ещё одну сложность?
01:23:35 ПП
User 118628034
Так и говорите - хрен знает :)
01:23:41 ПП
User 118628034
DSL тут кто-нибудь писал свой?
01:23:48 ПП
User 4627228
SQL изначально делался вот так просто, для менеджеров
01:23:55 ПП
User 4627228
Но в итоге мы видим)
01:24:13 ПП
01:24:14 ПП
User 118628034
Менеджеры в те времена были не те
01:24:22 ПП
01:24:28 ПП
01:24:39 ПП
User 4627228
Сейчас они просто супер эффективные как никогда:)
01:24:45 ПП
User 118628034
Наоборот
01:25:04 ПП
User 185980313
да с языком для джиры тоже не все ок сейчас, что бы написать запрос, нужно лезть в документацию
01:26:36 ПП
User 88403602
User 185980313
да с языком для джиры тоже не все ок сейчас, что бы написать запрос, нужно лезть в документацию
она ж подсказывает всё что можно
01:26:36 ПП
User 118628034
Да это вообще ад
01:27:28 ПП
User 118628034
Там покруче чем SQL, ну ладно. Идея-то простая, если есть - попробовать выкатить, полетело - подумаьт над использованием.
01:35:32 ПП
User 4627228
На MoscowJS в НИИ Восход был доклад про DSL
01:35:50 ПП
User 4627228
Можешь загуглить :) Там автор как раз такие вопросы решал
02:31:02 ПП
User 152745946
У rethinkdb крутой repl
03:06:38 ПП
User 775925
А у кого-нибудь есть опыт работы с mobx (или derivableJs)? Можете поделиться им? (:
03:09:08 ПП
User 78986164
ребят, а что производительнее в реакте если нужно иногда не выводить компонент: 
1) навесить hidden на него
2) не создавать
03:12:02 ПП
03:12:58 ПП
User 119754639
<div>{isMyComponentNeeded ? <MyComponent /> : ''}</div>
03:16:26 ПП
User 78986164
почему это будет быстрее чем hidden?
03:17:18 ПП
User 88403602
с hidden его всё равно в dom впиливать надо
03:17:34 ПП
User 119754639
Потому что if boolean быстрее чем виртуал дом и потом работа с dom.
03:18:10 ПП
User 119754639
А еще, если мне память не изменяет, это стандартная практика и вроде даже в оф доках есть примеры.
03:19:05 ПП
User 88403602
даже в первом ангуляре есть 2 различных варианта для скрытия: в 1м случае вообще не рендерить, а во втором прятать
03:19:07 ПП
User 78986164
нагуглил вот на SO
03:21:05 ПП
User 23384802
https://www.youtube.com/watch?v=7Py5PKXsacU
youtube.com/watch?v=7Py5PKXsacU
Изоморфность без прикрас, или серверный рендеринг без Node.js | Александр Зубов (Avito) Сейчас никого не удивишь изоморфным приложением на react’е: node’a на...
03:21:09 ПП
User 23384802
Боже, какое извращение)
03:21:19 ПП
User 23384802
выполнить серверный рендер реакт компонента на js через php, в котором передаются некоторые php функции вместо js-овских
03:21:56 ПП
User 119754639
А вот это интересный момент. Про необходимость удаления dom node я даже не подумал. Наверное если интерфейс часто переключается можно прятать. Но вот, кстати, при серверном рендере экономичнее изначально не рендерить.
03:23:08 ПП
User 88403602
так тут тогда вопрос в том, нужно ли будет его показывать потом
03:23:31 ПП
User 23384802
http://storage1.static.itmages.com/i/16/0516/h_1463412183_2271492_8e8ed41771.jpeg
storage1.static.itmages.com/i/16/0516/h_1463412183_2271492_8e8ed41771.jpeg
03:23:34 ПП
User 23384802
красота)
03:23:37 ПП
User 88403602
если нужно, тогда через класс, если 1 раз посчитал, надо или нет - тогда через if
03:24:04 ПП
User 185980313
это в авито так ?)
03:24:19 ПП
User 23384802
Да, но, наверное, серверный рендеринг с пхп везде такой)
03:24:30 ПП
User 23384802
https://github.com/phpv8 впервые узнал об этом)
github.com/phpv8
GitHub is where people build software. More than 27 million people use GitHub to discover, fork, and contribute to over 80 million projects.
03:24:40 ПП
User 119754639
User 88403602
так тут тогда вопрос в том, нужно ли будет его показывать потом
И как много таких элементов будет и как часто будет происходить их переключение. Значит каждый конкретный случай надо отдельно рассматривать.
03:26:11 ПП
User 88403602
ну вот из последнего, у меня был юзкейс, что админам на странице показываются дополнительные кнопки. вероятность, что юзер станет админом без перезагрузки страницы равна нулю, значит кнопки можно вообще в дом не добавлять
03:27:02 ПП
User 88403602
а если, например, у тебя кнопка появляется когда поле становится не пустым, тогда через класс надо
03:28:03 ПП
User 119754639
Вот, нормальный юзкейс.
03:28:26 ПП
User 40529464
@anorudes https://www.youtube.com/watch?v=GKOHa2tYiZw SSR React в Java
youtube.com/watch?v=GKOHa2tYiZw
(Recorded at Jfokus 2016. http://www.jfokus.com) Isomorphic JavaScript apps Isomorphic (greek: "isos" = equal, "morph" = shape) JavaScript apps are JavaScrip...
03:28:42 ПП
03:30:00 ПП
User 189012702
Добрый день, подскажите пожалуйста сколько запросов на рендер в среднем вытянет SSR на nodejs и phpv8? У кого сколько в полке?
03:31:22 ПП
User 23384802
про phpv8 как раз видео выше) Там говорится на эту темуц
03:31:45 ПП
User 39182759
а какие вообще преимущества у ssr перед пререндером?
03:32:23 ПП
User 151893222
сео, слабые устройства, время первого отображения
03:32:50 ПП
User 39182759
вот по SEO есть какие-то реальные отличия?
03:34:15 ПП
User 151893222
раскройте суть реализации пререндера)
03:36:34 ПП
User 152745946
prerender.io наверное имеется ввиду
prerender.io
Allow your AngularJS, ReactJS, or VueJS apps to be crawled perfectly by search engines. View on Github.
03:37:35 ПП
User 152745946
с SSR не нужно никаких правок в коде, а от мысли, что код может работать и на сервере, компоненты становятся проще и понятнее, а API внутреннее чище. Ну это мое ИМХО
03:38:18 ПП
User 152745946
плюс есть возможность отрендрить кусок приложения вообще не напрягаясь. И рядом с JSON API положить HTML API для мобильных устройств. Блоки комментариев, рейтинги и прочую фигню
03:42:56 ПП
03:43:04 ПП
User 152745946
эм, в реакте прокси теперь используются?
03:53:45 ПП
User 187983007
ребят, кто-то сталкивался с ошибкой вебпака Cannot GET /, когда запускает его на локалхосте
03:54:05 ПП
User 187983007
в терминале показывает все ок, сбилдился
03:54:33 ПП
User 185980313
не правильный publicPath к примеру )
03:54:41 ПП
User 185980313
если просто билдить, то в норм папку кладет?
03:54:43 ПП
User 187983007
Я вот решил просто бабел 6+ заюзать и webpack-middleware
03:55:01 ПП
User 187983007
он на локалхост должен выкидывать же
03:55:51 ПП
User 185980313
если используешь middleware, то наверное проблема в express.static
03:56:38 ПП
User 185980313
это если в дев режиме/watch, если попробовать собрать, то должен положить все файлы по пути path
04:00:01 ПП
User 187983007
entry: [
        'webpack-hot-middleware/client?path=http://localhost:3000',
        './src/index'
    ],
    output: {
        path: path.join(__dirname, 'static'),
        filename: 'bundle.js',
        publicPath: '/static/'
    },
04:00:16 ПП
User 187983007
вот такое, не пашет
04:00:36 ПП
User 187983007
бандл билдится, но в папке его нет
04:00:44 ПП
User 37835067
Вышел бесплатный курс по redux'у от Wes Bos'a https://learnredux.com
learnredux.com
20 video tutorials to help you learn how to build JavaScript apps with React.js and Redux.
04:01:06 ПП
User 185980313
User 187983007
бандл билдится, но в папке его нет
если в watch режиме, то там и не появится
04:02:08 ПП
User 187983007
нет, он не в watch режиме
04:04:34 ПП
User 185980313
у тебя файл вебпака лежит в корневой директории проекта?
04:04:50 ПП
04:46:45 ПП
User 4627228
Друзья, для тех кто пропустил.

Недавно вышел Node.js 6 поэтому мы решили в четверг вечером (19 мая в 19:00) провести шестой Node.js Meetup. Как обычно, в формате общения, порисовать маркерами, поделиться опытом - кто-что сделал, у кого-где сломалось, кто-как решил проблемы, обсудить последние новости и тренды.

В этот раз ещё и сделать несколько небольших докладов по темам:
1) Микросервисная архитектура и CoreOS, Денис Измайлов (Startup Makers, CEO) 
2) Производительность React.js Server-side Rendering, Вадим Жуланов (Rambler, Lead Front-end Developer) 
3) Обзор DEIS, Владимир Махаев (DecisionMapper, Fullstack JS Developer)  
4) Flow и Node.js, Владимир Курчаткин 
5) e-Commerce в переходный период с Bitrix в Node.js, Артур Бир (Dr. Head, CTO)

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

В этот раз нас с радостью согласился принять Mail.Ru в своей комфортной зоне обучения, где мы уютно расположимся на 23 этаже, в нашем распоряжении будут доска, фломастеры, проектор и чай-кофе-печеньки.

Мероприятие бесплатное, регистрируемся здесь:
http://www.meetup.com/Moscow-NodeJS-Meetup/events/231141123/
05:37:57 ПП
User 199126836
Немножко оффтоп, подскажите хорошую, бесплатную тулзу для wireframes, кто что использует?
05:44:18 ПП
User 202047214
Может кто-нибудь подсказать? Разбираюсь дальше с реактом, добрался до момента, когда нужны свойства из дом ноды. Пишу что-то подобное:
render() {<FlightInfoFull items={items} ref={(c) => this._elems.flightInfoFull = c} />}

componentDidMount() {
const elems = this._elems;
const currentBlock = elems['flightInfoFull'];  console.log(currentBlock.getBoundingClientRect());
}
и получаю фигу, какие то есть секретные особенности работы с рефами? судя по доке фб должны быть доступны в таком варианте методы
06:04:13 ПП
User 153807368
Где return в ф-ции render?
06:04:37 ПП
User 153807368
В ref передавай строку а не функцию
06:10:52 ПП
User 199126836
User 202047214
Может кто-нибудь подсказать? Разбираюсь дальше с реактом, добрался до момента, когда нужны свойства из дом ноды. Пишу что-то подобное:
render() {<FlightInfoFull items={items} ref={(c) => this._elems.flightInfoFull = c} />}

componentDidMount() {
const elems = this._elems;
const currentBlock = elems['flightInfoFull'];  console.log(currentBlock.getBoundingClientRect());
}
и получаю фигу, какие то есть секретные особенности работы с рефами? судя по доке фб должны быть доступны в таком варианте методы
Для компонентов ref будет получать инстанс компонентов, а не дом элемент
06:12:53 ПП
User 199126836
Нужно использовать ReactDOM.findDOMNode() чтобы получить дом элемент
06:18:15 ПП
User 597730
Вот тут есть пример формочки с refs: http://stackoverflow.com/questions/29503213/use-state-or-refs-in-react-js-form-components
stackoverflow.com/questions/29503213/use-state-or-refs-in-react-js-form-components
I am starting with React.js and i want to do a simple form but in the documentation I have found two ways of doing it. The first one is using Refs: var CommentForm = React.createClass({ handle...
06:27:03 ПП
User 215843293
/stat@comstatbot
06:34:02 ПП
User 63637623
User 199126836
Нужно использовать ReactDOM.findDOMNode() чтобы получить дом элемент
oO уже пятьсот лет как не надо

this.refs['refName'] возвращает непосредственно дом элемент
06:34:48 ПП
User 63637623
User 153807368
В ref передавай строку а не функцию
почему? это удобно, не особо рекомендуется https://facebook.github.io/react/docs/more-about-refs.html

> React also supports using a string (instead of a callback) as a ref prop on any component, although this approach is mostly legacy at this point.
facebook.github.io/react/docs/more-about-refs.html
A JavaScript library for building user interfaces
06:37:57 ПП
User 199126836
User 63637623
oO уже пятьсот лет как не надо

this.refs['refName'] возвращает непосредственно дом элемент
Это если ref="refName"
06:38:04 ПП
User 63637623
User 199126836
Это если ref="refName"
нет
06:38:14 ПП
User 63637623
> this.refs['refName'] возвращает непосредственно дом элемент
06:39:05 ПП
User 199126836
When attaching a ref to a DOM component like <div />, you get the DOM node back; when attaching a ref to a composite component like <TextInput />, you'll get the React class instance
06:39:52 ПП
User 199126836
Это если callback
06:43:48 ПП
User 63637623
Да, ок.
06:44:07 ПП
User 63637623
User 202047214
Может кто-нибудь подсказать? Разбираюсь дальше с реактом, добрался до момента, когда нужны свойства из дом ноды. Пишу что-то подобное:
render() {<FlightInfoFull items={items} ref={(c) => this._elems.flightInfoFull = c} />}

componentDidMount() {
const elems = this._elems;
const currentBlock = elems['flightInfoFull'];  console.log(currentBlock.getBoundingClientRect());
}
и получаю фигу, какие то есть секретные особенности работы с рефами? судя по доке фб должны быть доступны в таком варианте методы
Тогда верное замечание —
06:44:15 ПП
User 63637623
Нужно использовать ReactDOM.findDOMNode() чтобы получить дом элемент
06:44:34 ПП
User 63637623
Но ещё лучше написать так, чтобы не было необходимости вызывать этот метод
06:50:26 ПП
User 63637623
User 199126836
Это если callback
в обоих случаях же
07:13:25 ПП
07:22:34 ПП
User 138612574
ребят, подскажите пожалуйста как на мак установить node конкретной версии. просто через терминал или через brew
07:23:09 ПП
User 90246751
Я для таких целей юзаю nvm
07:23:42 ПП
User 90246751
nvm должен быть в brew вроде
07:27:44 ПП
User 202047214
User 199126836
Нужно использовать ReactDOM.findDOMNode() чтобы получить дом элемент
Хм, findDOMNode тоже пробовал, получаю undef not a function
07:28:05 ПП
User 202047214
сейчас попробую откатить до него, может что-то упустил
07:28:30 ПП
User 138612574
ну поставлю я его, а дальше какой командой, если навскидку помнишь?
07:28:49 ПП
User 151893222
nvm install <version>
07:29:25 ПП
User 138612574
а, даже так. спасибо, попробую
07:33:37 ПП
User 202047214
Все таки не находит метод
07:34:49 ПП
User 202047214
User 63637623
Но ещё лучше написать так, чтобы не было необходимости вызывать этот метод
К сожалению мне нужна высота элемента, без конкретных значений не проанимировать
07:37:43 ПП
User 63637623
Речь о том, чтобы избежать вызова
.findDOMNode()
, а не о том, что не надо обращаться к самому дом элементу. Впрочем метод не запрещён )
07:38:09 ПП
User 63637623
User 202047214
Все таки не находит метод
это уже у себя ищи ошибку, метод никуда не пропадал https://facebook.github.io/react/docs/top-level-api.html#reactdom.finddomnode
07:39:18 ПП
User 202047214
нашел ошибку) спасибо)
07:39:36 ПП
User 202047214
User 63637623
Речь о том, чтобы избежать вызова
.findDOMNode()
, а не о том, что не надо обращаться к самому дом элементу. Впрочем метод не запрещён )
А есть еще варианты добраться до дома?
07:40:06 ПП
User 202047214
хотя ладно, сам поищу) спасибо :)
07:40:45 ПП
User 63637623
ref же. Суть в том, чтобы организовать компоненты так, чтобы к дом-элементу обращался тот реакт компонент, который непосредественно его содержит, и выдавал апи наружу, если нужно
07:44:11 ПП
User 202047214
Связал все, еще раз спасибо