Тенденции. 2014. 2015...

Board index Общие разделы Оффтопик

Description: Здесь можно обсудить всё, что не связано с тематикой сайта.
Moderator: Поддержка

Post #1by factotum » 08.01.2014, 19:32

мастхейв sass, csso и прочие вкусняшки, ставшие уже нормой.
Заинтересовало:
Topcoat - легкое создание сайтов/приложений с акцентом на производительность
Intel® XDK NEW - инструмент создания приложений/сайтов
suitcss UI framework для создания приложений/сайтов
icomatic - сборщик собственный шрифтов
icomoon - еще один сборщик шрифтов.

Надеюсь, найдется что добавить и Вам.
Last edited by factotum on 16.07.2015, 14:09, edited 1 time in total.
Если "улучшение" стало "граблями" - Вы его переросли
factotum
Topic author, Гуру
Location: Люксембург
Reputation: 232
With us: 5 years 6 months

Post #2by factotum » 22.01.2014, 22:39

Раз завел речь о инструментах, то "кабы было".
редакторы цветовых схем:
https://kuler.adobe.com/
http://colorschemedesigner.com/

Added after 7 minutes 29 seconds:
Ну и инструменты мастхей для верстки за компанию:
compass

autoprefixer - пишем в W3C, за префиксы отвечает сабж.
csso - пережимает CSS с оптимизацией
Оба плагина для Node.js, есть и адаптированные версии для Ruby
Если "улучшение" стало "граблями" - Вы его переросли
factotum
Topic author, Гуру
Location: Люксембург
Reputation: 232
With us: 5 years 6 months

Post #3by factotum » 31.01.2014, 15:53

Вышел официальный порт Bootrarap SASS: https://github.com/twbs/bootstrap-sass
Сам Bootstrap сменил лицензию на MIT
Если "улучшение" стало "граблями" - Вы его переросли
factotum
Topic author, Гуру
Location: Люксембург
Reputation: 232
With us: 5 years 6 months

Post #4by VEG » 01.02.2014, 00:26

Последняя новость очень приятная :)
С наилучшими пожеланиями, Евгений
VEG M
Администратор
Avatar
Age: 30
Location: Минск, Беларусь
Reputation: 1574
With us: 5 years 6 months

Post #5by factotum » 09.02.2014, 12:27

factotum wrote:порт Bootstrap SASS
Неделя работы с фрейворком не впечатлила. Огромное количество переменных, сваленных на одной странице, огромное количество миксов для префиксов... В общем оказалось не совсем удобным. Вчера не выдержал и все закончилось банальным переписыванием. Убрал все правила и миксы с префиксами, где можно обойтись правилами W3C (с префиксами прекрасно справляется autoprefixer). Для большинства правил подошел полюбившийся набор функций из Compass - "Vertical Rhythm". Переменные по возможности разнес по соответствующим модулям. Фреймворк полегчал, стал более читаемый. Скорее, более удобный под себя.

Немного о SuitCSS от Nicolas Gallagher (автор normalize.css). Фреймворк достаточно легкий, работать просто. По мне, легкость и оказалась единственным плюсом. Подойдет в проектах на страницу-другую или как стартовый набор. Если необходимо точное соответствие в различных браузерах, придется дописывать, что подразумевает знание кросс-браузерных особенностей. Все разукраски придется писать самостоятельно. Хотя есть мнение, со временем фреймворк повзрослеет. На данном этапе, SuitCSS не способен тягаться с решениями Bootstrap, отшлифованными не без помощи немалой армии комьюнити.
Если "улучшение" стало "граблями" - Вы его переросли
factotum
Topic author, Гуру
Location: Люксембург
Reputation: 232
With us: 5 years 6 months

Post #6by factotum » 26.02.2014, 01:23

Ratchet 2.0 - CSS/JS фреймворк для быстрой разработки мобильных приложений. "It's now a part of the Bootstrap organization"
http://goratchet.com/
Лицензия MIT :angel:
Если "улучшение" стало "граблями" - Вы его переросли
factotum
Topic author, Гуру
Location: Люксембург
Reputation: 232
With us: 5 years 6 months

Post #7by factotum » 05.03.2014, 21:48

Если "улучшение" стало "граблями" - Вы его переросли
factotum
Topic author, Гуру
Location: Люксембург
Reputation: 232
With us: 5 years 6 months

Post #8by Sumanai » 05.03.2014, 23:34

Хром онли?
Использование поиска продлевает жизнь.
Это форум поддержки форка phpBBex. Поддержка по phpBB осуществляется в других местах.
Sumanai M
Гуру
Avatar
Reputation: 1608
With us: 4 yaers 9 months

Post #9by factotum » 08.03.2014, 15:32

Sumanai wrote:Хром онли?
о тестах CSS?
Там обычные вебстранички с множеством повторений правил. Замеры производились при помощи консоли - в браузерах Веб-кит, вкладка Timeline
Был бы благодарен за подсказку работающего инструмента для замера пересчетов и времени отрисовки в Firefox
Если "улучшение" стало "граблями" - Вы его переросли
factotum
Topic author, Гуру
Location: Люксембург
Reputation: 232
With us: 5 years 6 months

Post #10by Sumanai » 08.03.2014, 16:19

Из презентации какого- то яндекса:
Image
Image
Да да, картинками, текста там нет, хоть руками переписывай.
Вроде ка должно дать такой результат:
Image

Added after 1 minute 53 seconds:
factotum wrote:Замеры производились при помощи консоли - в браузерах Веб-кит, вкладка Timeline

Поэтому смысла в ориентировании на эти результаты я не вижу, пока не будет результатов с других движков.
Использование поиска продлевает жизнь.
Это форум поддержки форка phpBBex. Поддержка по phpBB осуществляется в других местах.
Sumanai M
Гуру
Avatar
Reputation: 1608
With us: 4 yaers 9 months

Post #11by factotum » 08.03.2014, 17:57

Sumanai wrote:Поэтому смысла в ориентировании на эти результаты я не вижу, пока не будет результатов с других движков.
дополните результатами в Фоксе. Пусть с другой методологией измерений - сравнивается селекторы/правила, а не браузеры
Если "улучшение" стало "граблями" - Вы его переросли
factotum
Topic author, Гуру
Location: Люксембург
Reputation: 232
With us: 5 years 6 months

Post #12by Sumanai » 08.03.2014, 18:43

factotum wrote:дополните результатами в Фоксе.

Я вообще не понял, как те скрипты нужно запускать и как применить его к конкретной ситуации :smile:

factotum wrote:Пусть с другой методологией измерений - сравнивается селекторы/правила, а не браузеры

Есть вероятность, что правила, которые быстро отрабатывают в вебките, будут тормозить в ФФ и ИЕ, в зависимости от методологии измерений. И наоборот.
Использование поиска продлевает жизнь.
Это форум поддержки форка phpBBex. Поддержка по phpBB осуществляется в других местах.
Sumanai M
Гуру
Avatar
Reputation: 1608
With us: 4 yaers 9 months

Post #13by factotum » 09.03.2014, 17:45

Sumanai wrote:Есть вероятность, что правила, которые быстро отрабатывают в вебките, будут тормозить в ФФ и ИЕ, в зависимости от методологии измерений. И наоборот.
неплохим началом были бы результаты с описанием метода
Сами методы без проблем можно сравнить в браузерах веб-кит. Поправки на метод станут более читаемые :)
Если "улучшение" стало "граблями" - Вы его переросли
factotum
Topic author, Гуру
Location: Люксембург
Reputation: 232
With us: 5 years 6 months

Post #14by factotum » 10.03.2014, 09:04

Sumanai wrote:Да да, картинками, текста там нет, хоть руками переписывай.
букмарклет:
Code: Select all
javascript:(function(){var script=document.createElement('script');script.src='//yandex.st/jslibs/_rt.js';document.body.appendChild(script);})()

Added after 7 minutes 51 second:
и эта страница:
screenshot.94.jpg
screenshot.94.jpg (125.43 KiB) Viewed 9952 times
Если "улучшение" стало "граблями" - Вы его переросли
factotum
Topic author, Гуру
Location: Люксембург
Reputation: 232
With us: 5 years 6 months

Post #15by Sumanai » 10.03.2014, 13:16

Суть понята. Ладно, будем по порядку. Железо i5-3570, 8ГБ, GTX 650 Ti BOOST, софт ОС Windows XP Prof x64, браузер ФФ 27.0.1
Походу включена верт. синхронизация, поэтому больше 65 кадров мы не увидим. Сами тесты:
Spoiler
attribute-selectors
193 ms.
195 ms.
9 ms.
63 FPS

background
32 ms.
31 ms.
5 ms.
65 FPS

background-color
32 ms.
32 ms.
5 ms.
64 FPS

box-sizing-reset
37 ms.
38 ms.
5 ms.
65 FPS

box-sizing-reset-separate
37 ms.
38 ms.
5 ms.
64 FPS

class-selectors
193 ms.
194 ms.
9 ms.
62 FPS

grid-flexbox
113 ms.
112 ms.
39 ms.
65 FPS

grid-floats
302 ms.
302 ms.
64 ms.
65 FPS

grid-inline-block
268 ms.
268 ms.
62 ms.
65 FPS

grid-tables
151 ms.
150 ms.
59 ms.
65 FPS
Что же, мы доказали, что пока flexbox не поддерживается всеми браузерами, нужно верстать таблицами :razz:
Использование поиска продлевает жизнь.
Это форум поддержки форка phpBBex. Поддержка по phpBB осуществляется в других местах.
Sumanai M
Гуру
Avatar
Reputation: 1608
With us: 4 yaers 9 months

Post #16by factotum » 10.03.2014, 17:20

Sumanai wrote:Что же, мы доказали, что пока flexbox не поддерживается всеми браузерами, нужно верстать таблицами
для приложений андроида и iOS уже верстаю flexbox :hi:
В качестве универсального решения - таблицы тоже вариант, но не такой гибкий, как обтекание или flexbox
Я за flexbox. Очень нравится простота и гибкость. Поддержка старыми браузерами реализуется с помощью поллифилов.
Например, http://flexiejs.com/
Грабли присутствуют, но это сравнительно небольшая плата за использование устаревших браузеров
Last edited by factotum on 10.03.2014, 17:25, edited 1 time in total.
Если "улучшение" стало "граблями" - Вы его переросли
factotum
Topic author, Гуру
Location: Люксембург
Reputation: 232
With us: 5 years 6 months

Post #17by Sumanai » 10.03.2014, 17:24

factotum wrote:для приложений андроида и iOS уже верстаю flexbox :hi:

Ну, это очевидно, там нет ИЕ и оперы 12.

factotum wrote:Я за использование flexbox.

Я тоже, но через пару лет. А пока старыми добрыми float.

Так что по результатам? У меня хром только на виртуальной машине, результаты будут не аутентичные.
Использование поиска продлевает жизнь.
Это форум поддержки форка phpBBex. Поддержка по phpBB осуществляется в других местах.
Sumanai M
Гуру
Avatar
Reputation: 1608
With us: 4 yaers 9 months

Post #18by factotum » 10.03.2014, 17:33

Sumanai wrote:Так что по результатам?
Это же очевидно. Сами все видели - Flex впереди планеты всей. Остальные результаты показали несущественные различия. Имеет смысл давать поправки на методы?
Под настроение попробую пропихнуть пулл методологии на основе Яндекса :smile:
Если "улучшение" стало "граблями" - Вы его переросли
factotum
Topic author, Гуру
Location: Люксембург
Reputation: 232
With us: 5 years 6 months

Post #19by Sumanai » 10.03.2014, 17:54

factotum wrote:Остальные результаты показали несущественные различия.

Точнее таблицы в два раза быстрее остальных, флекс в три раза, всё остальное да, в пределах погрешности.
Различие в два раза я бы не развал несущественными.
Использование поиска продлевает жизнь.
Это форум поддержки форка phpBBex. Поддержка по phpBB осуществляется в других местах.
Sumanai M
Гуру
Avatar
Reputation: 1608
With us: 4 yaers 9 months

Post #20by factotum » 10.03.2014, 18:57

Sumanai, подразумевал селекторы, бекграунды.
По сеткам разницы понятны :)
Если "улучшение" стало "граблями" - Вы его переросли
factotum
Topic author, Гуру
Location: Люксембург
Reputation: 232
With us: 5 years 6 months

Next

Return to Оффтопик