Архив недели @oleg008
Понедельник
Привет, на этой неделе с вами @oleg008. Я занимаюсь фронтендом, раньше также писал на ноде. Работаю на @chatgrapecom.
Трачу кучу времени на опен сорс. Вот мой эккаунт github.com/kof. Один из моих последних проектов github.com/jsstyles/jss
Буду говорить о десктопном и мобильном фронтенде ну и обо всем что с ним связано. Сегодня темя дня #css написаный на #javascript.
Когда-то я написал вводную статью о #jss medium.com/@oleg008/the-i… чтоб обьяснить какие проблемы это решает в двух словах.
чтобы не повторять то что уже написано в блоге и на гитхабе, было бы интересно услышать вопросы по github.com/jsstyles/jss а так же критику
кстати @cssunderhood моя тема сегодня плотно пересекается с твоей)
кстати jss нужен как бы не всем, обычные лэндинги - врядле, весь упор на компонентизацию, в реакт оно идет лучше github.com/jsstyles/react…
сложных компонентов быть в принципе не должно) они на то и компоненты чтоб быть простыми @yuritkachenko
проект над которым я работаю написан с #jss но он не открытый, хотелось бы портировать todo app на него, есть jsstyles.github.io/jss-examples/c…
вот накидал просто примеров из проекта c #jss и #es6 gist.github.com/kof/96dad9a4d6… @yuritkachenko
мне почему то кажется что stylus + postcss + webpack вот это велосипед, причем такой очень сложный с кучей привязок, в jss все проще
CSS как то стремится к JS) добавляют одну фичу за другой, а у меня вопрос - зачем тогда нам нужен второй язык если в нем будет тоже самое)
наследование реализуется более прямым способом github.com/jsstyles/jss-e…
вопрос чье это окружение, если ты пишешь виджет который встраивается в чужой сайт то тебе надо перегрузить глобальные рулы @andrey_sitnik
согласен, некий шум есть, но есть консистентность и четкая логика @andrey_sitnik
если очень хотеть избавиться от ковычек можно придумать свой язык on top of js и сделать все значения встроенными @andrey_sitnik
и такое мнение я уже слышал, лично у меня времени больше уходит на тестирование и продумывание чем на скорость печати @cssunderhood
поэтому я считаю скорость печати ВООБЩЕ НЕ ВАЖНА, важна четкая логика - легкость понимания и отсутствие багов ... @cssunderhood
всегда хотел увидеть людей которые строчат css с такой скоростью чтоб без автокомплитов прям процесс разработки замедляется @cssunderhood
jss производит обычные стили, вставляет style элемент, поэтому нет разницы в данном примере @ErrorSoul
магии нет, хочешь перезагрузить глобальный css - делай это ручками, это впринципе легко смотри jss-extend и es6 {...} @andrey_sitnik
да, с БЭМ можно жить, но наименования остаются глобальными и их надо хорошо продумывать и это не легко и не красиво @andrey_sitnik
именно поэтому все классы в #jss сгенерированы, именования локальные и могут быть плохими, это не растекается по приложению @andrey_sitnik
все еще только пол решения, нужны константы, функции итд. и в идеале доступные из js, кстати функции в css всем нравятся? @alexeyraspopov
это можно и нужно добавить в jss, возможно в виде плагина @andrey_sitnik
тебе не нужен ... в css это все не зря добавляют ... @alexeyraspopov
впринципе добавить all: initial; в каждую рулу тривиально через плагин для jss, надо срочно сделать) @andrey_sitnik @iamstarkov
не зная проект сказать не могу, #jss это не швецарский нож, даже если очень хочется засунуть его везде, лично мне @blia
с postcss можно решить большинство проблем, нельзя автопрефиксинг в рантайме - тоесть надо грузить все префиксованые декларации @gusnkt
автоматизированой изоляции от наследуемых свойств пока что нет, идею мне подкинули тут сегодня и я создал ишью,а так ручками @ierhyna_web
давай @alexeyraspopov порви всех чувак!
готовься, подмывайся, будешь следующим) @alexeyraspopov
для тех кому собственно проект интересен: мне нужна помощь в его развитии: новая документация, интересные примеры, todo app итд
вот кстати табличка с популярными css in js решениями, правда критерий мало github.com/MicheleBertoli…
кстати да вот интересно было бы посмотреть как jss стиль на clojure будет выглядеть @mr_mig_by
вот кстати вам пример не тривиальный использования, пока что еще в работе, мигрирую библиотеку @elementalui на #jss github.com/elementalui/el…
Вторник
вот таких контрибутеров я желаю всем кто делает свои опен сорс проекты github.com/jsstyles/css-v…
всем доброе утро, сегодня можем поговорить о кроcсплатформенной разработке ui на js
в смысле о мобильно вебной разработке
хочу рассказать вам одну историю, поделиться кое какими мыслями на эту тему и конечно же пару ссылочек.
В общем пару лет назад я работал над своей идеей и решил делать мобильное приложение на js) В тот момент очень шумела одна либа famo.us
То что вы видите сейчас на их сайте это их новое направление к которому они перешли потерпев неудачу со старым.
До этого они подняли 25мио на js framework который должен был позволить писать нам приложения со сложными переходами и жестами как на нэтив.
В общем я решил их опробовать, у них интересные идеи по оптимизации рендеринга и организации кода. Фреймворк был сырой и я фиксил кучу багов
вобщем ишью я насоздавал там немало github.com/Famous/famous/… как выяснилось потом они уже ждали с нетерпением меня) github.com/Famous/famous/…
продолжу через пол часа, митинг)
Вобшем проблема у этой компании в странном понимании опен сорса. Как выяснлилось позже они уже работали над новой версией.
они как бы открыли свой фреймворк, но никогда не говорили что они там делают и куда ведется разработка.
вобщем по мне это не опен сорс, это freeware
опен сорс в моем понимании это в первую очередь открытая коммуникация, возможность дать людям понимать что происходит и участвовать
вобщем компания famo.us мягко сказать стремная. За то я так познакомился с их на тот момент главным архитектором @dmvaldman
он вскоре ушел из этой компании и на данный момент разрабатывает на базе своего кода написанного тогда новую штуку samsarajs.org
он в этом году приезжал в берлин и много об этом рассказывал, в частности вот его видео c @jsconfeu youtube.com/watch?v=biJXpv…
идея в #samsarajs в том что лэйоут это набор стримов которые надо координировать. Ведь если вы посомтрите на переходы в ios меню с гамбургер
то это не одна анимация, их целая куча. Вот реализация этого меню на #samsarajs samsarajs.org/examples/
восновном все движки которые пытаются симулировать такие переходы на js они кастрированые. Просто переход это не все.
нужно обрабатывать поток ивентов от жестов к примеру при ведении палца и реагировать соответственно координируя ВСЕ анимации для перехода.
и это сделать совсем не просто, а в частности сделать это эффективно и читабельно.
АПИ которая позволит самому создавать такого рода переходы не супер сложно насколько я знаю кроме как у этого проекта не существует.
Есть куча UI либ которые делают все эти вещи за тебя, но это другой уровень абстракции. Там ты не можешь придумать свой особенный переход.
кто верит что мы сможем писать мобильные ui по качеству не хуже чем нативные на js ретвитьте samsarajs.org @dmvaldman
давайте перечислим все методы оптимизации перформанса рендеринга на js, я начну а вы добавляйте)
Проблема с DOM это количество собственно элементов которые находятся в render tree, его надо держать на минимуме.
Также проблема с DOM в том что очень много медленных методов а также свойства являются сеттерами и неожиданно делают много всего под копотом
Поэтому любые манипуляции DOM опасны для перфа, даже чтение многих свойств, казалось бы безобидных.
на тему перфоманса скоро будет интересный воркшоп smartme.university/workshop/chall…
соответственно проблема с абстракциями ... тк в пользовательском коде ты дергаешь то что надо когда этого требует бизнес логика @roman01la
Следущая оптимизация рендеринга - requestAnimationFrame developer.mozilla.org/en-US/docs/Web…
если нужна поддержка старых девайсов, есть кроссплатформенный shim для requestAnimationFrame github.com/kof/animation-…
@jsunderhood проблема в том, что порой чтение приводит к reflow
такого не встречал, если есть пример то в студию twitter.com/oelifantiev/st…
еще есть проблемы с полупрозрачностью, особенно если такой элемент анимировать
а еще у нас есть уборщик мусора garbage collector который может заморозить весь ui thread в любой момент, поэтому надо всегда делать паузы
для того чтоб обойти все проблемы с reflow к примеру #samsarajs позизионирует все контейнеры которые будут анимироваться абсолютно
для этого используется свой кастомный layout engine которые знает где какой контейнер в любой момент времени из js
Среда
по поводу justgetflux.com : я пользовался ей пол года, сначала было непривычно, потом привык
потом почувствовал что она мне садит зрение и решил отказаться. Могу подтвердить чтоб засыпать легче если ее использовать.
Четверг
расскажу о том как мы на @chatgrapecom мигрируем все на #reactjs
тк взять все и переписать слишком долго времени займет, нужен процесс миграции. Мы используем github.com/PixelsCommande… @PixelsCommander
плюс полифил для кастомных элементов github.com/WebReflection/…
получается что каждый внешний реакт компонент регистрирует свой кастомный элемент, который используется старым кодом.
Тред (@oleg008)
Object.create(null) это впринципе простая версия Map, если обьект используется как хранилище данных и ключи вне контроля, то это норм.
для Map нужен полифил, если тебе нужен микро мэп то это Object.create() к примеру использовать это в небольшой либе - ок. @mr_mig_by
конечно я бы предпочел Map в приложении плюс полифил, там где микро оптимизации размера не важны @mr_mig_by
насколько я знаю фаерфокс сплошной говнокод плюс на экстеншены никто апи не стандартизирует вроде. @mr_mig_by
Пятница
А кто может обьяснить почему многие разработчики не любят фронтенд? мне лично не раз попадались ...
Я когда-то перешел с фронтенда на ноду, года 2 работал, вернулся в фронтенд. Здесь постоянно что-то новое происходит. А там скукота.
Болшинство бэкендов сводятся к передачи данных из базы кудато еще и к пользователю ...
Бэкендлеры этакие переносчики стримов)
вообще надо еще различать между верстальщиками и фронтенд инженерами ... я сейчас верстальщиков не имею ввиду, так это не инженерия
поэтому верстальщики пожалуй пока останутся верстальщиками en.wikipedia.org/wiki/Engineeri… @twenty
@rubyunderhood @twenty @jsunderhood @mr_mig_by инженером является любой собравший из говна и палок по мануалу из "очумелых ручек" скворечник
так и есть. twitter.com/Chudesnov/stat…
если бы ты придумал свое говно и палки, то тебя бы называли ученым, а так пока что мы инженеры ... хотя иногда мы инженеры-изобретели
/@Chudesnov @twenty @jsunderhood @mr_mig_by значит я уже к 13 годам был сеньор-инженером!
почему бы и нет! twitter.com/rubyunderhood/…
@mr_mig_by @jsunderhood cuz [1] + [1] === 2а вот и нет) twitter.com/roman01la/stat…
Воскресенье
Вопрос: чем пользуются у вас в командах для коммуникации кроме эмаила?
А какие являются основные критерии или функции по которым вы выбирали чат?
я работаю на chatgrape.com , фокус на безопасность, интеграцию сервисов, встроенный поиск по сервисам, попробуйте ...
и так моя неделя подошла к концу, с вами был @oleg008, желаю всем поменьше говнокода)
