количеством свойств может быть?

279 vs 61

> Генерация Critical CSS при SSR Это круто, хотя я почему-то думаю что генерировать Critical path для css на каждом рендере на реально сложных страницах затратнее и дольше чему отдать юзеру целый чанк css для текущей страницы

Это уже вопрос серверных мощностей и алгоритмов, в целом - не сильно затратней рендера Virtual DOM. Есть ещё подходт как у ребят из Wallmart, где рендерятся только критичные компоненты (изначально так в LinkedIn делали).

количеством свойств может быть?

Так не все же наследуются? (каскадируются)

Ну мы же с перфоманса начали. Вот такое использование просто гораздо дороже

Так не все же наследуются? (каскадируются)

и?

all: initial не про наследование

он про сброс всех свойств в initial

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

Я чё-то use case не могу понять)

all:initial serves 2 purposes: 1) reset cascade 2) reset semantic

Ну мы же с перфоманса начали. Вот такое использование просто гораздо дороже

Истина где-то посередине :) Если это достаточно недорогая операция, то почему бы и нет? :) А если как glamour, то точно нет. ))

all:initial serves 2 purposes: 1) reset cascade 2) reset semantic

Про 1 мы определились - это приятный бонус и решает те же задачи, что и jss-isolate. А вот второе зачем может быть?

Про 1 мы определились - это приятный бонус и решает те же задачи, что и jss-isolate. А вот второе зачем может быть?

https://iamstarkov.com/isolated-button/#!/Button/7

один компонент

три вида тегов

выглядеть должно одинаково

Про 1 мы определились - это приятный бонус и решает те же задачи, что и jss-isolate. А вот второе зачем может быть?

разобрался?

А, понял

А, понял

тебе может быть интересно https://twitter.com/iamstarkov/status/826546861297303556

А, понял

Как Normalizr?

тебе может быть интересно https://twitter.com/iamstarkov/status/826546861297303556

Yep! like

Как Normalizr?

so so

more like resetcss

1. Генерация Critical CSS при SSR 2. Шаринг стилей с React Native 3. Кастомизация стилей в зависимости от настроек (цвета / шрифт / пр) 4. Отсутствие необходимости юзать webpack на сервере Продолжать? :)

4. он и с css modules не нужен, достаточно бабеля 3. с препроцессорами это делается не сложнее, ну или каким-нибудь react css themr, например так что можно и продолжить))

4. он и с css modules не нужен, достаточно бабеля 3. с препроцессорами это делается не сложнее, ну или каким-нибудь react css themr, например так что можно и продолжить))

5. Отсутствие необходимости юзать babel на сервере :)

Я тоже юзаю jss, но больше как early adopter. И хз надо ли нестить, но уже встречаются такое в коде '&.blabla': {...}

большой плюc rr в относительной стандартизации все же. новый в проекте человек скорее всего сходу поймет что происходит, с самописным это большая проблема.

А это уже от роутера зависит, точнее от того как его использовать. Можно описывать роутинг так, чтобы от одного взгляда на код стало понятно, что происходит. Например: const routing = { '/': MainPage, '/auth': AuthorizationPage };

Всем привет, давно сюда не заходил, как тут дела?)))

http://cssinjs.org/who-is-using кто использует JSS добавляйте свои продукты, компании итд.

Как по мне styled-components вносят лишнюю абстракцию

А мне вот очень не нравится для писать каждый раз div className classes.name Жуть, хотя по сути это компонент, <Name и всё проще.

а есть ли возможность в styled-components css описать вне js?

а есть ли возможность в styled-components css описать вне js?

А где?

во внешнем *.css и подключать к компонентам или это уже извращение?

во внешнем *.css и подключать к компонентам или это уже извращение?

Тебе не нужен ?

как и никому

как и никому

На звезды посмотри в гитхабе

На звезды посмотри в гитхабе

У бутстрапа тоже звёзд много.

а у бутстрапа нет ничего плохого

а у бутстрапа нет ничего плохого

Нажористое заявление.

Нажористое заявление.

Главное правильно готовить это дело

Главное правильно готовить это дело

https://gist.github.com/iAdramelk/d328b73c72cab92ef95f

Хотя да. Можно же просто сетку взять оттуда.

Хотя да. Можно же просто сетку взять оттуда.

Можно брать оттуда то что тебе требуется, в вашей же статье написано "Когда Boostrap можно использовать" - c этим совершенно согласен.

Это же не значит что он плохой, просто он решает другие задачи, имхо)

а как-то можно sass переменные импортировать и использовать с postcss? вот я именно не про плагины типа simple vars etc, а про то как использовать существующие переменные определенные во внешнем каком-то .scss типа http://blueprintjs.com/docs/#variables

а у бутстрапа нет ничего плохого

+

а как-то можно sass переменные импортировать и использовать с postcss? вот я именно не про плагины типа simple vars etc, а про то как использовать существующие переменные определенные во внешнем каком-то .scss типа http://blueprintjs.com/docs/#variables

пройтись автозаменой как мне кажется самое простое.

ох, похоже придется копировать их в проект

а как-то можно sass переменные импортировать и использовать с postcss? вот я именно не про плагины типа simple vars etc, а про то как использовать существующие переменные определенные во внешнем каком-то .scss типа http://blueprintjs.com/docs/#variables

Ровно так, как там описывается, подключаешь импорт к своему корневому цсс-файлу. К постцсс плагинам добавляешь precss

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

но я ведь не смогу использовать эти переменные?

Сможешь, естественно

У precss внутри полная поддержка sass + он спокойно кокатенирует модули. Так что первой строчкой подключаешь этот файл (ну или как минимум до первого использования) и всё работает

Чтобы всё работало с scss синтаксисом, precss добавляешь вот так: require('precss')({ extension: '.scss'})

это офигенно просто, спасибо, пробую

;)

я понял, вот эта штука https://github.com/postcss/postcss-scss парсит, забавно, я как-то пропустил это

я понял, вот эта штука https://github.com/postcss/postcss-scss парсит, забавно, я как-то пропустил это

Если я правильно тебя понял, поправлю - этот плагин не нужен, если используешь precss, так как там поддержка синтаксиса включена. Ведь тебе изначально нужна поддержка и sass variables и scss-расширения. Это можно собрать отдельно из postcss-scss и какого-нибудь отдельного для sass плагина. А можно заюзать precss - там это всё уже есть. Как-то так)

а, меня смутило, что в https://github.com/jonathantneal/precss#usage просят и то и то ставить

Хм, а ведь действительно. Это очень странно, ведь там внутри модуль https://github.com/jonathantneal/postcss-partial-import подключен, именно от него та настройка extension ?

В сущности, можешь попробовать без postcss-scss завести сначала, а если не выйдет - его тоже подключить) У меня на проекте вроде без него работает

а как составные части precss отдельно настраиваются, если у меня postcss.config.js типа такого? module.exports = ctx => ({ from: ctx.form, to: ctx.to, plugins: { precss: { extension: '.scss' }, ... } ... }

ERROR: S client not available

просто как отдельные плагины? или как-то внутри precss? сек, я просто попробую) ну и похоже мне теперь postcss-import не нужен, раз уж в precss входит postcss-partial-import

Все настройки в те же фигурные скобки, где extension) и да, я тоже повыкидывал несколько плагинов, подключив precss

Хотя да. Можно же просто сетку взять оттуда.

хм, помоему сетка это как раз наименее полезная часть бутстрапа..

react-router 4 кто-нибудь использует? Есть вариант redirect'а без использования компонента Redirect, а с помощью функции?

react-router 4 кто-нибудь использует? Есть вариант redirect'а без использования компонента Redirect, а с помощью функции?

Занимался этим вопросом. Если коротко - да, но там где редиректите должен быть контекст инстанса роутера.

Занимался этим вопросом. Если коротко - да, но там где редиректите должен быть контекст инстанса роутера.

Благодарю за ответ, как раз так и реализовал. Просто было сомнение в присутствии данного функционала в четвертой версии.

Мне не особо понравилось это их увлечение контекстом и пренебрежение навигацией по изменению хистори.

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

подскажите, что учить в экосистеме reactjs: react-router, flux, redux что ещё?

Что тебе понадобится, то и учи

а ты уже выучил?

Хотел спросить у реакт экспертов, если я использую портал-технику для модальных окон, я не пожалею об этом потом? Ну то есть, фб не собирается выпиливать unstable_rendersubtreeintocomponent?

господа, как в реакте вешаете onClick на <div> ?

пришёл к варианту передачи функции в props <div {...props} />

но тогда ещё передаются лишние атрибуты

пришёл к варианту передачи функции в props <div {...props} />

<div onClick={props.onClick}/>

ругается eslint на такой вариант

Не вижу другого варианта

чота странно, задача поди распространённая

чота странно, задача поди распространённая

А внутри дива что? Может this.props.handlerClick?

ну вообще задача такая:

есть тайтл, который надо менять. <div>Axis title</div> при клике менять на <input type=“text” value=“Axis title” /> а потом опять менять на <div>{измененный тайтл}</div>

чтобы это было аккуратно, в рамках одного блока (ячейки).. будто в excel

ну или сразу делать только input, и при изменении старое значение сохранять в атрибут

Как в JSS сделать селектор в зависимости от родителя? Например, мы стилизуем кнопку, но хотим изменить стиль в зависимости от родителя (или родительского пути). В простом CSS это могло бы быть: .special-parent .this-cool-button { background: red; }

А внутри дива что? Может this.props.handlerClick?

внутри дива переменная-текст, то есть вот так: <div>{title}</div>

'& .this-cool-button': {}

Как в JSS сделать селектор в зависимости от родителя? Например, мы стилизуем кнопку, но хотим изменить стиль в зависимости от родителя (или родительского пути). В простом CSS это могло бы быть: .special-parent .this-cool-button { background: red; }

https://cssinjs.github.io/repl/