Комментарии 26
Как давно Веб Компоненты стали CSS-фрейворком/библиотекой?
В голосовании нужен пункт «ожидал увидеть сравнение css-фреймворков/библиотек, начиная читать статью».
Звучит всё хорошо. Выглядит хорошо. Масштаб работы просто замечательный. Статью бы прочитал с удовольствием…
Только почему при прочтении вашей статьи мне кажется, что вы писали не статью на хабр, а курсач в МЭСИ? Господи, пролог, введение, всё такое…
Вот, прочитайте два десятка статей отсюда: habrahabr.ru/top/alltime
Потом садитесь, расслабьтесь и начинайте писать статью про фреймворки. Не спрашивайте если она кому-то нужа или не нужна. Просто напишите хорошую, жирную такую статью про фреймворки. И все эти фреймворки переберите по всем бинарным косточкам, через все возможные тесты. Не пишите туду.джс, пишите что-то более реальное. Напишите пару зубодробительных тестов с плавающими меню и полной зменой стилей через цсс. Проверните все эти ворки через мясорубку кода. Возьмите реально засраный сайт и переделайте его на этих фреймворках. Потом сядьте, представьте что перед вами сидит лучший друг-программист с бутылкой пива и напишите статью так, как будто вы пытаетесь с этим другом поспорить. Не пишите статью так, как будто вы сидите перед преподом на защите курсовой.
Вы точно уйдёте в топ.
Только почему при прочтении вашей статьи мне кажется, что вы писали не статью на хабр, а курсач в МЭСИ? Господи, пролог, введение, всё такое…
Вот, прочитайте два десятка статей отсюда: habrahabr.ru/top/alltime
Потом садитесь, расслабьтесь и начинайте писать статью про фреймворки. Не спрашивайте если она кому-то нужа или не нужна. Просто напишите хорошую, жирную такую статью про фреймворки. И все эти фреймворки переберите по всем бинарным косточкам, через все возможные тесты. Не пишите туду.джс, пишите что-то более реальное. Напишите пару зубодробительных тестов с плавающими меню и полной зменой стилей через цсс. Проверните все эти ворки через мясорубку кода. Возьмите реально засраный сайт и переделайте его на этих фреймворках. Потом сядьте, представьте что перед вами сидит лучший друг-программист с бутылкой пива и напишите статью так, как будто вы пытаетесь с этим другом поспорить. Не пишите статью так, как будто вы сидите перед преподом на защите курсовой.
Вы точно уйдёте в топ.
Типография — это место, где книги печатают, расскажите про типографику. И выше сказали верно — не пишите курсовик, слишком унылый стиль. А так — жгите, интересно.
Уже хорошо то, что вы собрали большинство современных библиотек и фреймворков в одном месте. Но тестировать всех их… Масштаб работы реально огромен, ведь. Не устанете? Настолько ли важно заниматься их сравнением. Интернет сейчас такой быстрый, пройдёт пол года — появится ещё цепочка новых решений.
Я лично как-то в последнее время всё больше отхожу от больших решений в сторону Riot.js компонентов. Простые, лаконичные. Можно легко за несколько десятков минут написать полностью рабочий компонент, который в достаточной мере будет обособлен от остального контента сайта. На текущий момент жизни, это самое удобное и простое решение для меня. + Kube CSS фреймворк в качестве основы для сайта. Ибо красивый, приятный, лаконичный. Я его последнюю версию преобразовал в Sass для большего удобства, ибо нынче Less уже давно проигрывает в популярности. И вроде как хорошо живётся)
Я лично как-то в последнее время всё больше отхожу от больших решений в сторону Riot.js компонентов. Простые, лаконичные. Можно легко за несколько десятков минут написать полностью рабочий компонент, который в достаточной мере будет обособлен от остального контента сайта. На текущий момент жизни, это самое удобное и простое решение для меня. + Kube CSS фреймворк в качестве основы для сайта. Ибо красивый, приятный, лаконичный. Я его последнюю версию преобразовал в Sass для большего удобства, ибо нынче Less уже давно проигрывает в популярности. И вроде как хорошо живётся)
Я терпеливый, не устану)) Сколько раз уже успели применить Riot.js на рабочем проекте?
Riot.js я уже больше года применяю. На данный момент, мы его используем в разработке одного большого медицинского портала. Помимо реально сложных компонентов со сложной UI логикой, я, к примеру, создал несколько небольших Riot компонентов и описал в документации, как их применять. Получились небольшие кирпичики готового кода, которые можно применять в любом месте проекта.
Это такие компоненты, как:
— multi-select, Выбор нескольких элементов из списка, например, специальностей врачей
— upload-images, Загружалка нескольких изображений на наш сервер. Например, документов на регистрацию
— unfolding-items-list, Список определённых элементов, перечисляемый через запятую, в котором изначально отображаются только первые три элемента, а остальные можно увидеть, нажав на кнопку «ещё».
— show-more-text, Текст, большая часть которого изначально скрыта, но его можно легко «размернуть» на полный вид, нажав функциональную кнопку «Подробнее».
— dropdown, Кнопка, нажав на которую, мы можем развернуть список подпунктов
Вот, к примеру, компонент show-more-text: http://plnkr.co/edit/wGjRIVq0vkIXN9z0mmqh?p=preview
Вот таким же образом и создаются эти компоненты у нас)
Ну и, помимо этого мед. проекта, есть ещё где-то три-четыре других, где я тоже уже успел применить Riot.js.
Это такие компоненты, как:
— multi-select, Выбор нескольких элементов из списка, например, специальностей врачей
— upload-images, Загружалка нескольких изображений на наш сервер. Например, документов на регистрацию
— unfolding-items-list, Список определённых элементов, перечисляемый через запятую, в котором изначально отображаются только первые три элемента, а остальные можно увидеть, нажав на кнопку «ещё».
— show-more-text, Текст, большая часть которого изначально скрыта, но его можно легко «размернуть» на полный вид, нажав функциональную кнопку «Подробнее».
— dropdown, Кнопка, нажав на которую, мы можем развернуть список подпунктов
Вот, к примеру, компонент show-more-text: http://plnkr.co/edit/wGjRIVq0vkIXN9z0mmqh?p=preview
Вот таким же образом и создаются эти компоненты у нас)
Ну и, помимо этого мед. проекта, есть ещё где-то три-четыре других, где я тоже уже успел применить Riot.js.
Спасибо за интересный опыт! Не изучали, сколько он потребляет памяти при работе?
Пожалуйста) Эта библиотека довольно маленькая и простая. Это и есть одно из её достоинств. К примеру, jQuery 2.1.4 сейчас состоит из 9211 строк кода, Riot.js на данный момент состоит из 2377 строк. И памяти она ест совсем немного. По крайней мере, у нас еще не было такого, чтобы где-то в какой-то части приложения вдруг возникло непомерное её потребление)
не туда написал
Я кстати начинал работать на буржуев, они хотели все видеть на foundation. В итоге сейчас все делаю на foundation, хотя он по функционалу уступает boostrap 3
а как на счёт удобства?
Мы попробовали поменять bootstrap на Semantic-ui, мне показалось не удобным и сырым.
В семантике большая проблема с совмещением компонентов и вложеностью.
Я так и не смог зделать нормального верхнего меню.
Может я не умею его готовить, но с bootstrap-ом проще
Мы попробовали поменять bootstrap на Semantic-ui, мне показалось не удобным и сырым.
В семантике большая проблема с совмещением компонентов и вложеностью.
Я так и не смог зделать нормального верхнего меню.
Может я не умею его готовить, но с bootstrap-ом проще
Можете по подробнее рассказать?
К сожалению, нет, я работал с ним только на 2-3 страницах.
Но по первому впечатлению могу сказать что использовать его можно только в виде отдельных компонентов.
Да есть крутые.
Но как архитектура, semantic-ui не удобен.
А да вспомнил крутой косяк: Высота кнопки по умолчание 36px, а инпута 38px (из-за бордера)
Мне после бутстрапа, где все элементы красиво встают в ряд, показалось дико.
Но по первому впечатлению могу сказать что использовать его можно только в виде отдельных компонентов.
Да есть крутые.
Но как архитектура, semantic-ui не удобен.
А да вспомнил крутой косяк: Высота кнопки по умолчание 36px, а инпута 38px (из-за бордера)
Мне после бутстрапа, где все элементы красиво встают в ряд, показалось дико.
Иногда элементы плавают, особенно если компоновать в менюшке plain-text и кнопки, но достаточно легко правится парочкой доп стилей, без ошибок валидации и криков гугла на большой css-файл.
Странно что в «Комплексные css-фреймворки» включены очередные клоны Bootstrap наподобие KickStart (и что в этом списке делает Gridsm, если на сайте написано «A simple responsive CSS grid»?), а такие проекты как например Materialize или Material Design Lite обошли стороной, хотя звездочек на гитхабе у них на порядок больше.
Gridsm и правда не туда запихал, поправил. Materialize и Material Design Lite были добавлены для сравнения, спасибо!
По поводу KickStart, он развивается открыто с 2012 года, Bootsrap где-то c 2011, небольшая разница во времени. Да и мне кажется, что уже в то время (и даже раньше) множество студий имело свое подобие «Bootsrap», просто он был одним из первых качественных открытых решений.
очередные клоны Bootstrap наподобие— я не согласен, что клоны. Например Semantic-UI очень даже отличается от других.
По поводу KickStart, он развивается открыто с 2012 года, Bootsrap где-то c 2011, небольшая разница во времени. Да и мне кажется, что уже в то время (и даже раньше) множество студий имело свое подобие «Bootsrap», просто он был одним из первых качественных открытых решений.
В последнее время использую gridle.org (Сетка, на scss c различными полезными миксинами). Очень доволен )) Странно, что её не было в списке
Вопрос к автору. Прошу прощения за нескромность. А какой у вас опыт в разработке?
Если вы начниающий разработчик и хотите выбрать для себя фрейморк, то не утруждайтесь и используйте Bootstrap
Просто если у вас нет большого опыта вы вряд ли сможете оценить каждый фреймворк
Если вы начниающий разработчик и хотите выбрать для себя фрейморк, то не утруждайтесь и используйте Bootstrap
Просто если у вас нет большого опыта вы вряд ли сможете оценить каждый фреймворк
не туда
Продолжения ждать не стоит? :(
Зарегистрируйтесь на Хабре, чтобы оставить комментарий
Сравнение css-фреймворков/библиотек на живом примере. Часть 1