@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 11 мая 2016 г.

01:08:04 ДП
User 35172279
Перевод во что?)
03:46:17 ДП
03:59:46 ДП
User 143141567
User 35172279
Перевод во что?)
на русский, как я понял
06:09:10 ДП
User 31209702
https://github.com/skellock/reactotron
github.com/reactotron/reactotron
reactotron - A desktop app for inspecting your React JS and React Native projects.
06:21:01 ДП
User 153807368
кто нибудь пользуется кстати?
06:24:35 ДП
User 1245357
User 4627228
Коллеги, кто-нибудь занимается переводом https://github.com/airbnb/javascript ?
github.com/airbnb/javascript
JavaScript Style Guide. Contribute to airbnb/javascript development by creating an account on GitHub.
Все сделано уже - https://github.com/uprock/javascript :)
github.com/uprock/javascript
Contribute to uprock/javascript development by creating an account on GitHub.
07:19:47 ДП
User 68520717
@DenisIzmaylov зачем его переводить?
07:20:38 ДП
User 68520717
> uprock/javascript
> 2 years ago
> Все сделано уже
NNNope
07:34:16 ДП
User 1245357
@iamstarkov не обновлялась потому что на английском всех хватает ;)
07:40:36 ДП
07:41:00 ДП
User 68520717
Но это проблема, так как оригинал обновляется каждый месяц
07:42:41 ДП
User 1395200
User 68520717
Но это проблема, так как оригинал обновляется каждый месяц
Интересно, как выглядит у них код? :)
Или они постоянно после изменений все через автофикс какой-нибудь прогоняют?
07:44:39 ДП
User 68520717
через js-codemod
07:45:57 ДП
User 152745946
а кто 100% следует этому гайду?
07:46:38 ДП
User 152745946
я перестал когда добавили trailing comma в объектах
07:49:20 ДП
User 185980313
trailing comma да, тоже всегда отключаю и не понимаю зачем включили они.
07:50:02 ДП
User 152745946
ну у этого правила есть плюсы и огромный минус - ппц как непривычно
07:51:07 ДП
User 122105125
trailing comma — очень удобно. Довольно просто менять элементы в коллекциях местами
07:51:21 ДП
User 122105125
и удаление последнего никак не аффектит предыдущие
07:51:54 ДП
User 122105125
собственно из той же области, что и multivar
07:54:01 ДП
User 122105125
минус правда в том, что в очень старых ie будет синтаксическая ошибка
07:57:16 ДП
User 185980313
User 122105125
и удаление последнего никак не аффектит предыдущие
Так eslint подсветит или укажет что там ошибка, если не правильно. Единственное что, при комите в git не подсвечиваются такие затронутые строчки.
07:57:46 ДП
User 122105125
тут вопрос в дополнительной работе
07:58:02 ДП
User 122105125
придется вручную удалить запятную с предыдущей строки
07:59:12 ДП
User 122105125
т.е. с trailling comma меньше правок выходит.
08:11:00 ДП
User 1340580
Ну и в git чище коммиты с обязательной запятой, всегда ее ставлю.
08:11:23 ДП
User 1340580
jscs все сам за тебя делает (если вдруг забыл что).
08:24:36 ДП
User 153807368
airbnb codestyle использую и с большей частью правил согласен и доволен
с другой стороны - некоторые вещи слишком строги,
другие сугубо итог внутрикомандного соглашения и по сути опциональны
постепенно многие такие правила отрубил или модифицировал
как базу, этот кодстайл я бы рекомендовал всем более менее большим проектам
а опциональные детали уже обрабатываются напильником на месте
08:30:30 ДП
User 119754639
Кстати, по guidestyle.
7.12 Never mutate parameters. eslint: no-param-reassign
Зачем извращаться с вызовом hasOwnProperty через прототип Object'a?
08:31:27 ДП
User 119754639
Вызов obj.hasOwnProperty как-то может повлиять на что-то? Или это защита от undefined?
08:37:54 ДП
User 153807368
мб защита от случаев когда obj не объект?
08:40:47 ДП
User 187710551
защита от того что объект не наследует прототип объекта
08:42:07 ДП
User 4627228
User 68520717
@DenisIzmaylov зачем его переводить?
Наверное, это новость, но в России у большинства разработчиков проблемы с английским :)
08:44:20 ДП
User 47983686
User 4627228
Наверное, это новость, но в России у большинства разработчиков проблемы с английским :)
Думаю, проблема преувеличена
08:44:38 ДП
User 4627228
Ошибаешься :)
08:45:07 ДП
User 90246751
Хм, ни разу не встречал разработчика, который бы не говорил по-английски
08:45:15 ДП
User 47983686
Хотя бы не читал
08:45:29 ДП
User 90246751
Впрочем, это мой сугубо личный опыт, выборка нерепрезентативна
08:45:30 ДП
User 89478045
Все-таки корреляция между владением английским и компетентностью есть
08:46:02 ДП
User 119754639
User 153807368
мб защита от случаев когда obj не объект?
Может быть.
08:46:04 ДП
User 177102231
мне постоянно приходится тыкать пару человек в тиме за не правильно написанные по английски переменные и вот это вот все
08:46:05 ДП
User 47983686
Ну то есть я бы не взял разработчика, который не сможет на стековерфлоу ответ найти
08:46:36 ДП
User 119754639
User 187710551
защита от того что объект не наследует прототип объекта
Или кто-то перезаписал hasOwnProperty :)
08:46:39 ДП
User 47983686
да неправильное написани и говорение очень далеко от понимания технического английского на тему инструмента, которым пользуешься
08:47:14 ДП
User 74724319
User 90246751
Впрочем, это мой сугубо личный опыт, выборка нерепрезентативна
У тебя слишком много друзей из 1С
08:47:25 ДП
User 119754639
User 177102231
мне постоянно приходится тыкать пару человек в тиме за не правильно написанные по английски переменные и вот это вот все
Соболезную...
08:48:18 ДП
User 187710551
User 119754639
Или кто-то перезаписал hasOwnProperty :)
всякое может быть :)
08:48:22 ДП
User 89478045
User 74724319
У тебя слишком много друзей из 1С
08:48:34 ДП
User 119754639
User 74724319
У тебя слишком много друзей из 1С
08:48:53 ДП
User 90246751
User 74724319
У тебя слишком много друзей из 1С
Сложная шутка :с
08:49:18 ДП
User 119754639
User 187710551
всякое может быть :)
Реально первый раз такой подход встречаю. Но это же слишком длинно и как-то коряво выглядит. Неужто нет подхода попроще? :)
08:49:47 ДП
User 119754639
Особенно учитывая, что styleguide просто переполнен всякими штуками, которые нацелены на упрощение понимания кода.
08:57:27 ДП
User 4627228
Понимание и предсказуемость
09:03:42 ДП
User 4627228
Airbnb-codestyle хорош, я его даже в Redux впилил прошлым летом :) Но сейчас я настолько влюбился в стиль no-semicolons, что хоть отдельный CS создавай
09:03:56 ДП
User 119754639
Денис, предсказуемость поведения, наверное да, но встретив такую конструкцию
const key = Object.prototype.hasOwnProperty.call(obj, 'key') ? obj.key : 1;
с ходу сложно конкретно понять, зачем так извращаться.
09:04:21 ДП
User 68520717
@DenisIzmaylov eslint-preset-standard ?
09:04:51 ДП
User 4627228
User 119754639
Денис, предсказуемость поведения, наверное да, но встретив такую конструкцию
const key = Object.prototype.hasOwnProperty.call(obj, 'key') ? obj.key : 1;
с ходу сложно конкретно понять, зачем так извращаться.
Вот это перебор :) Где там такое советуют?
09:05:15 ДП
User 152745946
const hasOwnProperty = (obj, key) => {}.hasOwnProperty.call(obj, key);
09:05:17 ДП
User 119754639
https://github.com/airbnb/javascript#functions--mutate-params
github.com/airbnb/javascript
JavaScript Style Guide. Contribute to airbnb/javascript development by creating an account on GitHub.
09:05:29 ДП
User 4627228
Там может быть проверка в for-each?
09:05:40 ДП
User 119754639
Нет там такой проверки.
09:06:15 ДП
User 119754639
Уже сделали предположение, что hasOwnProperty может быть перезаписано или существует предположение о том, что в качестве аргумента могут передать не только лишь объект...
09:06:29 ДП
User 152745946
да просто говорят - не мутируй передаваемый как аргумент объект
09:06:32 ДП
User 152745946
читай между строк)
09:07:12 ДП
User 4627228
Да похоже
09:07:17 ДП
User 23384802
User 1340580
Ну и в git чище коммиты с обязательной запятой, всегда ее ставлю.
согласен
09:09:24 ДП
User 192559518
давно пора делать cvs которая умеет в ast
09:09:34 ДП
User 119754639
User 152745946
да просто говорят - не мутируй передаваемый как аргумент объект
Не мутировать - понятно зачем. А манипулировать им почему нельзя? :)
09:09:51 ДП
User 152745946
bad example выглядит так
09:09:58 ДП
User 152745946
obj.key = 1;
09:10:23 ДП
User 119754639
Это понятно
09:10:28 ДП
User 119754639
Это как раз мутация
09:10:46 ДП
User 4627228
User 192559518
давно пора делать cvs которая умеет в ast
👍🏼
09:11:48 ДП
User 152745946
User 192559518
давно пора делать cvs которая умеет в ast
вот это было бы здорово) Плевать на код-стайл и прочую фигню. Только диффы ast - это диффы сериализующего формата, json, например)
09:12:15 ДП
User 4627228
esgit commit -am 'something great'
09:15:15 ДП
User 152745946
cst уже допилили?
09:16:58 ДП
User 1340580
Мозилла не опускают руки - запустили тестовый полигон для проверки фич, называется TestPilot. Это расширение, позволяющее протестировать новые тестовые фичи браузера. Главное что вам нужно знать про тестпилот - ТАБЫ СБОКУ * https://testpilot.firefox.com
10:12:33 ДП
User 4627228
Ахаха :)
10:12:33 ДП
User 4627228
Unstuck Webpack, интерфейс для настройки Webpack, результат можно посмотреть и скачать — http://www.linuxenko.pro/unstuck-webpack/
10:14:10 ДП
11:27:13 ДП
User 31074873
http://reactkungfu.com/2016/03/dive-into-react-codebase-handling-state-changes/
reactkungfu.com/2016/03/dive-into-react-codebase-handling-state-changes
State. One of the most complicated concepts in React.js nomenclature. While some of us already got rid of it in our projects (Redux anyone?) by externalizing state, it is still widely used feature of React.js. While convenient, it can cause some issues. Robert Pankowecki, one of Rails meets React.js authors had the problem with validations when he started his journey with React. The story went like this: Validations seem to be quite easy to do, but there is a problem of vanilla form - first time user sees the input it should not get validated, even if it's invalid to have this input empty. This is definitely a stateful behaviour - so Robert concluded it'll be good to put his validation messages in state. So basically he just went and implemented the logic like this: ``` !javascript // ... changeTitle: function changeTitle (event) { this.setState({ title: event.target.value }); this.validateTitle(); }, validateTitle: function validateTitle () { if(this.title.length === 0) { this.setState({ titleError: "Title can't…
12:06:43 ПП
User 89339712
https://github.com/kadirahq/react-storybook
github.com/storybooks/storybook
storybook - UI Component Dev Environment for React
12:06:51 ПП
User 152745946
народ, а подскажите, как в вебпаке переопределить зависимость?
12:07:15 ПП
User 152745946
вот какая-то библиотека подключает lodash/get, а я хочу чтобы подключала src/utils/get ?
12:09:27 ПП
User 834744
пиши resolve.alias
12:23:07 ПП
User 152745946
мм, ну я пробую - не получается
12:23:13 ПП
User 152745946
как должен выглядить конфиг?
12:40:04 ПП
User 187710551
resolve: {
        alias: {
            get: 'src/utils/get',
        }
 }
12:41:03 ПП
User 686615
Как вы код подкрашиваете?)
12:41:18 ПП
User 162236709
User 686615
Как вы код подкрашиваете?)
как в markdown
12:41:23 ПП
User 187710551
далее просто import get from 'get'
12:43:07 ПП
User 187710551
кто-нибудь знает как в css modules импортировать весь файл как :global ?
12:55:50 ПП
User 57141131
завернуть весь контент файла в
:global {  }
01:03:58 ПП
User 63637623
кстати да, а получше вариант есть?
01:07:04 ПП
User 156544965
как вариант, добавлять постфикс .global.css и вешать еще один лоудер
01:07:25 ПП
User 156544965
https://github.com/chentsulin/electron-react-boilerplate/blob/master/webpack.config.development.js#L28

например
github.com/chentsulin/electron-react-boilerplate/blob/master/webpack.config.development.js
electron-react-boilerplate - Live editing development on desktop app
01:12:53 ПП
User 187710551
это уже лучше
01:13:45 ПП
User 1340580
User 187710551
это уже лучше
Дрочество.
01:14:15 ПП
User 187710551
а оборочивать в :global файл сторонней библиотеки нет?
01:16:20 ПП
User 1340580
User 187710551
а оборочивать в :global файл сторонней библиотеки нет?
В этом случае да, согласен, лодер логичное решение.
01:16:45 ПП
User 152745946
User 187710551
resolve: {
        alias: {
            get: 'src/utils/get',
        }
 }
внимательнее читаем вопрос) Мне нужно переопределить зависимость чужого модуля
01:20:29 ПП
User 124386122
User 152745946
внимательнее читаем вопрос) Мне нужно переопределить зависимость чужого модуля
Вместо get: пиши имя в том виде в котором сторонний модуль его подключает
01:20:48 ПП
User 152745946
а если это внутренняя зависимость?
01:21:23 ПП
User 124386122
по относительному пути типа ../get ?
01:21:55 ПП
User 152745946
например
01:22:03 ПП
User 152745946
хочу Link у RR переопределить
01:24:26 ПП
User 124386122
ну попробуй так же. Не уверен что прокатит правда
Если "какая-то библиотека" подключает внешнюю зависимость по относительному пути, то это плохо написанная библиотека ) 
Если ты хочешь свой модуль подсунуть - то форкай RR :)
01:26:05 ПП
User 152745946
в общем ответ - ты не должен такого хотеть
01:26:11 ПП
User 152745946
странный ответ ;)
01:28:17 ПП
User 185980313
вообще странно, зачем подключать модуль с другой библиотеки, при этом самому переопредлять на свой)
01:28:43 ПП
User 90246751
User 152745946
странный ответ ;)
Вполне логичный, как по мне
01:29:10 ПП
User 90246751
Подсовывать депенденси для third party либы
01:29:22 ПП
User 90246751
Ну как-то это уж очень странно
01:30:12 ПП
User 124386122
Правильно - ты можешь этого хотеть, но это странно :) Хотеть странного никто не запрещает, но от этого оно не становится нормальным, как минимум до тех пор пока того же не начнуть хотеть все остальные
01:30:40 ПП
User 124386122
Мне один раз тоже такое пригодилось, кстати.
01:31:08 ПП
User 124386122
Но это была зависимость по нормальному имени, не относительному пути.
01:31:11 ПП
User 152745946
форк - означает его поддержку
01:31:23 ПП
User 152745946
я не хочу поддерживать весь форк, мне нужно переопределить 1 файл
01:32:46 ПП
User 124386122
Относительный путь - это значит что ты хочешь часть либы поменять. Та, которую авторы не предполагали отделять как-либо от либы. А для этого есть правильный путь и тот что ты хочешь прикрутить.
Нет разницы поддерживать файл или форк :) 
У тебя твой файл будет ломаться и требовать фиксов/поддержки с точно таким же интервалом как и форк :)
01:33:15 ПП
User 124386122
по сути ты точно так же поддерживаешь файл
01:33:18 ПП
User 90246751
Так а в чем сложность поддерживать форк?
01:33:36 ПП
User 90246751
Просто мерджить его с оригинальным репозиторием периодически
01:35:09 ПП
User 152745946
на самом деле все не так)
01:35:12 ПП
User 124386122
файл - обновляешь зависимость, чинишь если поломалось.
Форк - мержишь апстрим (обновляешь зависимость), чинишь что поломалось, пушишь, обновляешь зависимость в аппе 

Если последние два действия очень напрягают то да, сложно. Если нет, то легко
01:35:17 ПП
User 152745946
я автор либы и именно так хочу сделать ее изменение
01:36:04 ПП
User 152745946
представь библиотеку компонентов, это не так, но представь
01:36:12 ПП
User 152745946
вот я хочу дать возможность переопределить кнопку
01:36:24 ПП
User 152745946
другие компоненты тоже могут использовать кнопки, внутри библиотеки
01:36:37 ПП
User 119754639
А в чем проблема тогда сделать для этого прогаммный интерфейс?
01:37:00 ПП
User 119754639
Зачем через webpack'и это делать, когда существуют более подходящие практики для этого?
01:38:05 ПП
User 152745946
например? проект же ты вебпаком собираешь
01:38:52 ПП
User 124386122
то что ты хочешь, должно быть заложено в либе в какой-либо форме. 
Например можешь заложить возможность менять это программно, можешь заложить возможность менять это вебпаком (подключать специально через алиасы например, чтобы пользователь либы мог их переопределить)
01:39:36 ПП
User 119754639
Так продумай интерфейс для переключения нужного компонента. Не знаю, там setComponentLayer(new CustomComponentLayer)?
01:39:39 ПП
User 124386122
Ты говоришь о том что либа для этого не предназначена, но хочется извратиться и заставить. Примерно с тем же успехом ты можешь регэкспом менять в собранном файле нужные строчки :)
01:39:54 ПП
User 152745946
программный интерфейс предполагает ограничения
01:40:04 ПП
User 152745946
если я что-то не запрограммирую - это невозможно переопределить
01:40:22 ПП
User 90246751
Но ты хочешь поменять модуль
01:40:28 ПП
User 119754639
Это в принципе нельзя переопределить, если ты это не запрограммируешь)
01:40:32 ПП
User 90246751
ну смотри, у тебя по дефолту используется lodash
01:40:36 ПП
User 119754639
Модуль же что-то делает
01:40:44 ПП
User 124386122
любой интерфейс предполагает ограничения. 
Если ты хочешь возможность менять либу без ограничений - я тебе уже сказал как это правильно делается ;)
01:40:45 ПП
User 90246751
Но у либы есть метод, типа setLibrary
01:40:50 ПП
User 119754639
Ты хочешь переопределить его стандартное поведение.
01:40:56 ПП
User 119754639
Или расширить
01:41:08 ПП
User 90246751
И ты можешь в него передать underscore или еще чего
01:41:08 ПП
User 152745946
ребята, вы что-то сложное говорите)
01:41:10 ПП
User 152745946
вот есть кнопка
01:41:12 ПП
User 152745946
тупая
01:41:18 ПП
User 152745946
у нее известен интерфейс
01:41:27 ПП
User 152745946
есть библиотека UI, которая использует эту кнопку
01:41:39 ПП
User 152745946
и таких компонентов "кнопок" 100шт еще разных
01:41:52 ПП
01:41:58 ПП
User 119754639
А в чем проблема?
01:41:58 ПП
User 152745946
так вот мне нужно понять, как в вебпак прокинуть пути для переопределения вот и все)
01:42:17 ПП
User 119754639
theme-style?
01:43:12 ПП
User 119754639
Если тебе надо переопределять что-то вроде темы (одна кнопка заменяется другой и т.п.), то тогда есть смысл определять некий параметр current theme и от него собирать.
01:43:53 ПП
User 152745946
кнопка - это пример. Это может быть что угодно. То, как выглядит сообщение, например
01:44:00 ПП
User 119754639
Я так понимаю, у тебя должна быть структура типа
themes/
  A/
     /button.jsx
  B/
    /button.jsx
01:44:20 ПП
User 90246751
Мне кажется, что ты пытаешься сделать что-то очень странное
01:44:28 ПП
User 90246751
Допустим, у тебя есть либа
01:44:29 ПП
User 119754639
А ты вот хочешь что-то вроде
THEMEID=A webpack ...
01:44:30 ПП
User 124386122
классический разговор в духе "не говорите мне что для получения ежа не надо слона на кактус натягивать, лучше расскажите как бы так натянуть чтоб слон не плакал" )
01:44:53 ПП
01:45:34 ПП
01:45:39 ПП
User 124386122
Наверняка у твоей задачи есть более нормальные решения. Но если ты хочешь решать ее именно так - то никто тебя конечно не остановит )
01:45:43 ПП
User 90246751
А которой есть кнопка, типа someLibrary.button. Как выходит, что ты не можешь просто сделать someLibrary.button = anotherButton
01:45:48 ПП
User 152745946
в общем вы не знаете как в вебпаке это переопределить - ок, не вопрос)
01:46:00 ПП
User 187710551
ну так вот самое просто и логичное это программный интерфейс
lib.init({
     button: require('./my-own-elephant-button.js')
})
01:46:04 ПП
User 119754639
User 90246751
А которой есть кнопка, типа someLibrary.button. Как выходит, что ты не можешь просто сделать someLibrary.button = anotherButton
А не проще сделать импорт нужной темы?
01:46:44 ПП
User 152745946
User 187710551
ну так вот самое просто и логичное это программный интерфейс
lib.init({
     button: require('./my-own-elephant-button.js')
})
так сейчас и сделано. Но это не гибко. Таким образом можно переопределить только те компоненты, которые прописаны
01:46:48 ПП
User 124386122
User 152745946
в общем вы не знаете как в вебпаке это переопределить - ок, не вопрос)
Ты можешь написать свой резолвер, если стандарные возможности не подходят. Ультимейт солюшен.
01:47:10 ПП
User 152745946
так я спросил - есть ли стандартная возможность)))
01:47:18 ПП
User 152745946
написать понятно, что можно
01:47:52 ПП
User 124386122
если ты автор либы - юзай алиасы прямо в ней, самое простое решение
01:47:58 ПП
User 124386122
алиасы саму на себя
01:47:59 ПП
User 119754639
А тебе принципиально в сборке не нужны другие компоненты, как я понял?
01:48:11 ПП
User 119754639
Т.е. тебе нужно все это на уровне сборки собрать, чтобы лишнего не было?
01:48:36 ПП
User 152745946
это скорее плюс такого подхода, а не самоцель
01:48:47 ПП
User 152745946
цель - дать возможность переопределить вообще что угодно
01:49:05 ПП
User 119754639
На уровне сборки?
01:49:09 ПП
01:49:16 ПП
User 124386122
это вредная утопия )
01:49:18 ПП
User 152745946
на уровне рантайма сейчас есть
01:49:22 ПП
User 152745946
и это не удобно
01:49:33 ПП
User 152745946
а ты что предлагаешь?)
01:49:56 ПП
User 119754639
Я бы предложил темы.
01:50:09 ПП
User 152745946
тема - это ограниченная штука
01:50:15 ПП
User 124386122
как минимум это "все что угодно" должно быть ограничено.
01:50:28 ПП
User 152745946
вот есть сообщение - тут можно кучу вещей изменить
01:50:31 ПП
User 119754639
Есть у тебя структура проекта, ты ее можешь дублировать в themes/custom директории по именам сборок, например.
01:50:50 ПП
User 119754639
И подсасывать от туда.
01:50:57 ПП
User 152745946
не, это sdk
01:50:59 ПП
User 119754639
Хотя я все равно не понимаю, зачем это на уровне сборки.
01:51:06 ПП
User 152745946
то есть подтягивается как npm модуль
01:51:18 ПП
User 152745946
потому что на уровне рантайма это надо учитывать во время разработки
01:51:20 ПП
User 124386122
А что именно "что угодно" для тебя?
01:51:21 ПП
User 90246751
Это чревато как минимум тем, что если код, который требует этой либы, будет абсолютно непонятен никому, кроме тябя
01:51:38 ПП
User 152745946
наоборот код становится чище
01:51:45 ПП
User 152745946
вот смотрите
01:51:56 ПП
User 152745946
я пишу require('../common/Button')
01:52:09 ПП
User 152745946
дальше кто-то идет и переопределяет этот button на уровне сборки
01:52:27 ПП
User 187710551
Я так понимаю в этом типо и смысл захотел любую зависимость любой либы локально заменил получил интерфейс и дальше делай и говнокодь у себя в проекте как хочешь
01:53:15 ПП
User 152745946
вот ща хороший пример покажу
01:53:27 ПП
User 119754639
Давай
01:53:33 ПП
User 119754639
А то прям вообще не понятно.
01:53:46 ПП
User 152745946
смотрите
01:53:49 ПП
User 152745946
есть babel-runtime
01:53:58 ПП
User 152745946
как babel предлагает оверайтить его
01:54:14 ПП
User 152745946
require('babel-runtime/core/promise').default = require('bluebird')
01:54:26 ПП
User 152745946
вот вы мне тоже самое предлагает
01:54:38 ПП
User 152745946
а я хочу это на уровне сборки. Что в этом желании не нормального?
01:55:35 ПП
User 119754639
Ну ок, теоретически идею понял. Хотя, скажем так, у babel реализация тоже корявая.
01:56:00 ПП
User 119754639
Тогда тебе нужна некая карта переопределения и резолвер.
01:56:11 ПП
User 152745946
а теперь следи за мыслью
01:56:19 ПП
User 152745946
есть вебпак, которым мы собираем приложения
01:56:33 ПП
User 152745946
я хочу на его уровне найти инструмент, который позволит это переопределить
01:56:43 ПП
User 152745946
если его нет - ок, напишу. В этом и был весь вопрос
01:57:10 ПП
User 152745946
бабел кривой - ок. предлагаю вам свой babel написать, который будет прямой)
01:57:25 ПП
User 119754639
Типа такой штуки
const resolverMap = {
  "components": {
    "buttons": {
      "BlueButton": "custom/path/to/BlueButton"
    }
  }
}

И соответствующие правила.
01:57:43 ПП
User 152745946
ты не ту проблему решаешь
01:57:49 ПП
User 152745946
ты мне говоришь как интерфейс дать
01:57:57 ПП
User 152745946
это я и так знаю
01:58:06 ПП
User 152745946
мне нужно понять как это сделать в кишках
01:58:24 ПП
User 152745946
а снаружи вообще на важно, будет там строка, или название компонента, или его id - вообще плевать
01:58:31 ПП
User 119754639
User 152745946
бабел кривой - ок. предлагаю вам свой babel написать, который будет прямой)
Так тут как раз вопрос в том, что я (например) не стремлюсь переписывать babel или другую неудобную либу. Речь о том, что есть какие-то стандартные практики, типа наследования, API да паттерны всякие, которые позволяют свои задачи решать и вроде как принято это все в разработке применять.
01:59:03 ПП
User 152745946
я тебе показал реальный пример с babel. У него есть полифил для промиса, и дока как переопределять
01:59:06 ПП
User 119754639
User 152745946
это я и так знаю
А, ну т.е. вопрос просто в том, есть ли стандартный способ это сделать в webpack.
01:59:16 ПП
User 152745946
мне кажется этот способ переопределения для фронтенда странным
01:59:24 ПП
User 152745946
потому что мы как минимум 2 реализации промисов тянем
02:00:18 ПП
User 124386122
Не мешайте человеку хотеть странного ) Если для него причины по которым так не делают не принципиальны - пусть делает )
02:00:27 ПП
User 119754639
User 152745946
потому что мы как минимум 2 реализации промисов тянем
Ну, вроде как bluebird сильно скоростнее чем все остальное.
02:00:52 ПП
User 152745946
просто фейспалм
02:00:57 ПП
User 152745946
я пишу одно - вы читаете другое))
02:01:27 ПП
User 152745946
если переопределять, как предлагает babel в бандле окажется 2, ДВЕ реализации промисов, а в рантайме одна, блюберд - да
02:02:00 ПП
User 152745946
Антон, тебе норм в бандл тащить код, который ты не используешь?)
02:02:00 ПП
User 119754639
Давайте оставим бабель
02:02:18 ПП
User 152745946
да не, отличный пример
02:02:24 ПП
User 152745946
у меня как раз тоже самое
02:02:27 ПП
User 119754639
Ну я изначально спрашивал, это принципиально вычистить неиспользуемый код или нет.
02:02:45 ПП
User 152745946
у бабеля полифил, вот у этого полифила я хочу переопределить кусок
02:02:58 ПП
User 124386122
require('babel-runtime/core/promise').default = require('bluebird') - как раз вот это насколько я помню можно решить алиасами
02:03:23 ПП
User 68520717
просто не полифиль runtime-ом
02:03:32 ПП
User 152745946
ну вот у меня не получилось это решить алиасами)
02:03:32 ПП
User 68520717
используй bluebird напрямую
02:03:43 ПП
User 124386122
покажи как решал
02:04:12 ПП
User 152745946
alias: {'babel-runtime/core/promise': 'bluebird'}
02:04:58 ПП
User 152745946
User 68520717
просто не полифиль runtime-ом
интересный подход) Не нравится маленький кусочек инструмента - выкидываем его нафиг, берем маленький кусочек, а остальные 90% инструмента дописываем сами, или как?
02:05:44 ПП
User 68520717
что из рантайма кроме промисов тебе ещё нужно?
02:05:59 ПП
User 152745946
String.prototype.includes
02:06:49 ПП
User 1340580
Вы прям здесь бем описываете, ребята :D
02:07:01 ПП
User 1340580
С его бандлами и уровнями переопределения.
02:07:27 ПП
User 152745946
ребята решают абстрактную задачу и не отвечают на конкретный вопрос)
02:07:50 ПП
User 68520717
babel-ю до фулл-стека бэма по сложности ещё очень далеко
02:09:40 ПП
User 1340580
Я и не сравнивал бабел с бемом, я говорю что идея то там уже изложена, просто инструмент этот скорей всего не подойдет. Хотя знаю человека который их сборщиком себе реакт собирает.
02:10:34 ПП
User 68520717
внутри яндекса некоторые команды тоже бэмом собирают реакт
02:10:55 ПП
User 68520717
@gusnkt я не знаю про includes =(
02:11:12 ПП
User 152745946
ты это к чему?)
02:11:49 ПП
User 68520717
> String.prototype.includes
02:12:00 ПП
User 90246751
Слушай, а ты случаем не делаешь что-то в духе конструктор лендингов? Типа тебе нужно продавать многим заказчикам одну и ту же примерно логику, и что бы максимизировать прибыль ты хочешь автоматизировать процесс переопределнием компонентов в сборщике?
02:12:20 ПП
User 68520717
я бы полифилил только то, что использую
02:12:27 ПП
User 68520717
а не всё разом
02:12:32 ПП
User 152745946
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/includes
developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/includes
The includes() method determines whether one string may be found within another string, returning true or false as appropriate.
02:12:37 ПП
User 68520717
чтобы бандл не разрастался
02:12:42 ПП
User 68520717
я знаю что это
02:12:55 ПП
User 152745946
User 90246751
Слушай, а ты случаем не делаешь что-то в духе конструктор лендингов? Типа тебе нужно продавать многим заказчикам одну и ту же примерно логику, и что бы максимизировать прибыль ты хочешь автоматизировать процесс переопределнием компонентов в сборщике?
ну примерно) только не лэндинги, а чатик
02:13:15 ПП
User 68520717
@gusnkt так это es2017
02:13:25 ПП
User 90246751
И ты хочешь, что бы либа была встриваемой, но при этом гибко и легко кастомизируемой
02:13:35 ПП
02:13:36 ПП
User 90246751
Теперь я понял, что и зачем ты хочешь сделать
02:13:36 ПП
02:14:04 ПП
User 90246751
Стандартными средствами сборщика ты это врядли сделаешь
02:14:06 ПП
User 68520717
скорее всего эту штуку можно просто пресетом es2017 сделать
02:14:29 ПП
User 152745946
в core-js это есть
02:14:39 ПП
User 152745946
я вообще метод из головы взял))
02:14:44 ПП
User 124386122
User 152745946
alias: {'babel-runtime/core/promise': 'bluebird'}
Это скорее всего проблема бабеля. Думаю алиасы резолвятся до того как он вставит свои импорты.
Для твоей либы это будет работать
02:14:53 ПП
User 152745946
String.prototype.trim - лучше пример?)
02:15:44 ПП
User 68520717
а зачем trim полифилить?
02:15:48 ПП
User 152745946
User 124386122
Это скорее всего проблема бабеля. Думаю алиасы резолвятся до того как он вставит свои импорты.
Для твоей либы это будет работать
я для своей либы это и делал. Просто перевел пример на тот, что в чате уже был
02:15:55 ПП
User 68520717
у него 100% support
02:15:59 ПП
User 124386122
ну я сейчас попробовал - все работает
02:16:09 ПП
User 124386122
не понимаю о чем тогда сыр бор )
02:16:54 ПП
User 152745946
гм, а как ты попробовал?
02:18:47 ПП
User 152745946
User 68520717
у него 100% support
ты вот опять не те вопросы спрашиваешь) Я взял babel исключительно ради примера. У него есть как раз подобное моему API и подобная проблема - что-то хочется переопределить
02:19:19 ПП
User 124386122
я проверил что алиас типа a/b работает норм. Следовательно,
в либе:
   require('buttons/coolbutton')
...
        alias :{
            'buttons/coolbutton': './src/ugly-lib-button.js',
        }


в аппе:

        alias :{
            'buttons/coolbutton': './src/my-super-cool-button.js',
        }

соберется с твоей подсунутой кнопкой
02:20:01 ПП
User 152745946
не, мне так не нравится. Возможны конфликты
02:20:41 ПП
User 152745946
допустим внутри проекта test есть require('./src/foo'), а я хочу переопределить test/src/foo
02:20:57 ПП
User 152745946
иначе такие алиасы могут поломать чужой код
02:23:54 ПП
User 124386122
не вижу что где должно поломаться
02:25:07 ПП
User 4627228
Electron 1.0: больше миллиона загрузок, демо-приложение, расширение для отладки, тесты — http://electron.atom.io/blog/2016/05/11/electron-1-0
electron.atom.io/blog/2016/05/11/electron-1-0
For the last two years, Electron has helped developers build cross platformdesktop apps using HTML, CSS, and JavaScript. Now we’re excited to share a majormilestone for our framework and for the community that created it. The releaseof Electron 1.0 is now available from electron.atom.io.
02:27:11 ПП
User 156544965
новый электрон огонь, да
02:27:27 ПП
User 156544965
завезли встроеные API уведомлений
02:28:05 ПП
User 124386122
User 152745946
не, мне так не нравится. Возможны конфликты
Ну, кактус твой - твое право жевать его любым приятным для тебя способом )
02:30:28 ПП
User 4627228
А если глаза устают читать, то ребята из Frontflip выпустили очередной бомбовый подкаст  http://frontflip.me/2016/05/05/vk-redesign.html
frontflip.me/2016/05/05/vk-redesign.html
Как изменился Вконтакте, какие технологии использовались и почему обошлись без реакта? Обсудили редизайн соцсети с Вячеславом Шебановым и Евгением Найденышевым.
02:31:27 ПП
User 152745946
а мне скучно показалось:(
02:33:05 ПП
User 185980313
и в дополнение выступление фронтедщика из вк https://www.youtube.com/watch?v=qseu-ZaGoes&feature=youtu.be&t=812
youtube.com/watch?v=qseu-ZaGoes&feature=youtu.be&t=812
Когда начинаешь работать с проектом вроде VK, это как когда заканчиваешь школу и поступаешь в университет. Нужно забыть все, чему вас учили в школе и учиться...
03:12:45 ПП
User 23384802
https://youtu.be/qseu-ZaGoes?t=780
youtube.com/watch?v=qseu-ZaGoes&feature=youtu.be&t=780
Когда начинаешь работать с проектом вроде VK, это как когда заканчиваешь школу и поступаешь в университет. Нужно забыть все, чему вас учили в школе и учиться...
03:12:55 ПП
User 23384802
причина почему вк отваливается)
03:31:21 ПП
User 23384802
доклад совсем не впечатлил. Сначала сказал, что не юзают сс методологию и как раз столкнулись с тем, что будут постепенно внедрять (вероятно бэм). Учитывая, что они делали с нуля новый дизайн, то не понимаю почему бы не заюзать современный стек. Старый gulp с less, отсутствие тестов. Любой может задеплоить одной кнопки. Рассказывают, что может сломаться сообщения у 100 млн и страхом держат разработчиков. По этой причине, видимо, у меня всегда отваливаются сообщений)
Про iframe вот интересно было немного, но надо больше подробностей нагуглить
03:32:03 ПП
User 23384802
css методологию*
03:32:13 ПП
User 23384802
в целом видос словно из 2013 года пришел
03:34:26 ПП
User 152745946
подкаст еще хуже
03:34:28 ПП
User 152745946
ппц тухло
03:39:24 ПП
User 4627228
ВК всё?)
03:40:16 ПП
User 152745946
чувак в докладе какую-то хрень выдает за дикий рокетсайнс))
03:41:05 ПП
User 152745946
вообще как они могли додуматься прямо по запросу клиента генерить css. CI - не, не слышали
03:49:46 ПП
User 185980313
там много тупняков и видео + подкаст помоему отличная антиреклама как работадателя да и вообще, сервиса )
03:50:44 ПП
User 4627228
По запросу клиента генерить critical CSS?
04:46:03 ПП
User 119754639
А чего бы его не генерить сразу при сборке билда?
04:46:54 ПП
User 12791
а что делать если количество бандлов будет 10**10? :)
05:07:51 ПП
User 119754639
Я думаю, что ответ заложен в самом вопросе :)
05:08:18 ПП
User 119754639
У фейсбука, говорят, выкладка новых фич проходит пару недель и ничего, живут как-то :)
05:18:36 ПП
User 187276728
ребят, кто-нибудь может простым языком вот это объяснить? https://github.com/typings/typings/blob/master/docs/external-modules.md
github.com/typings/typings/blob/master/docs/external-modules.md
typings - The TypeScript Definition Manager
05:18:48 ПП
User 187276728
хотя бы в 2 словах
05:19:45 ПП
User 187276728
я только разбираюсь, перечитал несколько раз – толком ничего не понял
06:12:45 ПП
User 202047214
Кто-нибудь может подсказать? популярные какие-то глабли, когда реактовский onClick тригерится при клике по дочерним нодам?
06:14:23 ПП
User 64167409
onClick на диве чтоли?
06:15:11 ПП
User 64167409
stopPropagation короч
06:15:11 ПП
User 202047214
похоже популярные))
06:15:38 ПП
User 101934369
https://facebook.github.io/react/docs/events.html#syntheticevent
 It has the same interface as the browser's native event, including stopPropagation() and preventDefault()
reactjs.org/docs/events.html
A JavaScript library for building user interfaces
06:18:08 ПП
User 202047214
спасибо :)
06:59:34 ПП
User 4627228
User 119754639
А чего бы его не генерить сразу при сборке билда?
А если он зависит от данных?
07:07:19 ПП
User 119754639
User 4627228
А если он зависит от данных?
Например?
07:15:51 ПП
User 152745946
в вебпаке есть возможность быстро собрать один и тот же бандл с разными опциями для плагинов?
07:16:01 ПП
User 152745946
для разных браузеров
07:22:02 ПП
User 198568579
Никто не знает можно ли в babel-е настроить условный транспайлинг в зависимости от версии браузера? либо в рантайме либо скомпилировать сборки для различных версий и браузеров и отдавать сервером по юзер-агенту
07:29:49 ПП
User 152745946
конкретно такой опции нет
07:30:06 ПП
User 152745946
но точно есть пресеты для современных браузеров и простых, можно сделать 2 билда
07:35:50 ПП
User 89339712
А для чего это нужно?
07:39:03 ПП
User 198568579
а как знать какой билд каким браузерам отдавать? нужна какая-то гибкая дифференциация чтобы я мог на последнем хроме использовать чистую сборку с yield-ами и нативными промисами а полмегабайтную сборку поллифилов с регенератором отдавать старым браузерам
07:43:33 ПП
User 89339712
https://modernizr.com/ хз может это
07:44:58 ПП
User 89339712
ES6 Generator Promises чекает вроде
07:46:20 ПП
User 12791
у нас в одной конторе был интересный подход к этому делу... юзерам отдавался минимальный билд а потом логились все ошибки на стороне клиента и слались обратно со всеми хедерами, юзерэйджентами и прочим. Потом прогоняли через хадуп и узнавали что для каких юзер ейджентов нужно добавить в бандл чтобы не ломалось
07:46:29 ПП
User 12791
не идеально, зато автоматизировано :)
07:48:15 ПП
User 198568579
modernizr это кажется вроде для клиента а мне нужно для ноды достать большую такую табличку соответвия юзер-агента и всех фич es6 и по ним опций и настроек бабеля чтобы отключить лишний код поллифилов при сборке. Никто не знает есть что-то такое готовое?
07:49:25 ПП
User 61730194
User 12791
у нас в одной конторе был интересный подход к этому делу... юзерам отдавался минимальный билд а потом логились все ошибки на стороне клиента и слались обратно со всеми хедерами, юзерэйджентами и прочим. Потом прогоняли через хадуп и узнавали что для каких юзер ейджентов нужно добавить в бандл чтобы не ломалось
🙈
07:50:02 ПП
User 89339712
https://www.npmjs.com/package/devcaps
npmjs.com/package/devcaps
Device Capabilities Detection Proxy
07:50:39 ПП
User 89339712
ой сорян
07:50:47 ПП
User 89339712
там же никакой поддержки
07:52:09 ПП
User 12791
User 198568579
modernizr это кажется вроде для клиента а мне нужно для ноды достать большую такую табличку соответвия юзер-агента и всех фич es6 и по ним опций и настроек бабеля чтобы отключить лишний код поллифилов при сборке. Никто не знает есть что-то такое готовое?
https://cdn.polyfill.io/v2/docs/
07:52:15 ПП
User 12791
но это только полифилы
07:52:24 ПП
User 12791
и в рантайме
07:57:15 ПП
User 89339712
ну готового решения я не нашел, можно в первый раз когда новый юзер агент заходит на сайт передавать данные от модернайзера на сервер и устанавливать соответствие с юзер агентом и далее когда такое соответствие установлено отдавать необходимый данные.
08:01:48 ПП
User 152745946
https://github.com/nkt/postcss-omit
github.com/nkt/postcss-omit
postcss-omit - PostCSS plugin for removing specified props
08:01:56 ПП
User 152745946
суперпростой плагин, вдруг кому-то пригодится)
08:02:32 ПП
User 89339712
https://css-tricks.com/make-client-side-data-available-server-side/
css-tricks.com/make-client-side-data-available-server-side
UPDATE: I have a newer article "Server Side Mustard Cut" that covers this same ground and has many of the quirks worked out. That's probably a better read.
08:04:19 ПП
User 89339712
User 152745946
https://github.com/nkt/postcss-omit
github.com/nkt/postcss-omit
postcss-omit - PostCSS plugin for removing specified props
а какие юз кейсы могут быть у твоего плагина?
08:04:28 ПП
User 152745946
а там в ридми как раз мой юзкейс
08:04:47 ПП
User 152745946
быстро запилил себе одним файлом в проекте, узнать не из-за анимаций ли все тормозит
08:04:57 ПП
User 152745946
оказалось из-за них)
08:05:28 ПП
User 152745946
вырубил transition/animation вообще все
08:20:43 ПП
User 89339712
я так понимаю полифил в браузерах не показывает что конкретно вызывает просадку фпс?
08:20:49 ПП
User 89339712
профайлер
08:20:51 ПП
08:32:21 ПП
User 101934369
User 198568579
а как знать какой билд каким браузерам отдавать? нужна какая-то гибкая дифференциация чтобы я мог на последнем хроме использовать чистую сборку с yield-ами и нативными промисами а полмегабайтную сборку поллифилов с регенератором отдавать старым браузерам
А может быть вынести полифилы в отдельный бандл и скачивать его только для старых браузеров?