Обновить
0
Семикин Никита@nightrunnerread⁠-⁠only

Frontend разработчик

Отправить сообщение

База знаний веб-разработчика: прокачиваем навыки владения CSS

Время на прочтение4 мин
Охват и читатели27K

Владея знаниями по вёрстке, можно достичь поставленных целей и перейти на следующую ступень профессионализма. В этой статье я расскажу, какие материалы мы с коллегами используем в своей работе: уверен, эта информация будет полезна разработчикам на CSS.

На базовом уровне

Цель: Помнить все свойства в CSS. Достигается примерно за 300 часов

Что изучать?

Читать далее

Сражаясь с БЭМ: 10 основных ошибок и как их избежать

Время на прочтение13 мин
Охват и читатели89K

Не важно, узнали ли вы о БЭМ только сейчас, или следите за ним с самого начала, вы, возможно, уже оценили столь полезную методологию. Если вы не знаете, что такое БЭМ, я рекомендую прочитать вам об этом на сайте БЭМ перед тем, как продолжить чтение этой статьи, потому что я буду использовать термины, которые предполагают базовое понимание этой CSS методологии.
image
Эта статья нацелена на людей, которые уже используют БЭМ и желают использовать его более эффективно, а также на тех, кто хочет узнать о нем больше.

Читать дальше →

Низкий FPS при прокрутке страницы. Решение проблемы background-attachment: fixed

Время на прочтение2 мин
Охват и читатели43K
Решил я тут недавно на одном из своих сайтов сделать легкий редизайн. И дошло дело до фона. Показался он мне каким-то скучным. Захотелось его немного «оживить». Подобрал подходящую картинку небольшого размера, загнал ее в свойство фона:

body{
	background: url("../images/bg.jpg") no-repeat center center / cover fixed;
}


и довольный нажал F5. Красота, да и только!

Начал скроллить страничку вниз и чувствую, что-то не то…


Такое чувство, как будто я играю в Crysis на очень старом компьютере. Почему же на сайте начались «тормоза» и прокрутка проходит рывками?

Я начал свое расследование…
Читать дальше →

Как ухудшить производительность вашего приложения — типичные ошибки разработчиков

Время на прочтение12 мин
Охват и читатели46K
Производительность считается одним из наиболее важных нефункциональных требований приложения. Если вы читаете эту статью, то, вероятно, используете приложение, например веб-браузер или программу для чтения документов, и понимаете, насколько велико значение производительности. В этой статье я расскажу о производительности приложений и о трех ошибках разработчиков, из-за которых не удается добиться высокой производительности приложений.


Читать дальше →

Как мы разогнали мобильную Lenta.ru до скорости света

Время на прочтение9 мин
Охват и читатели42K
image

AMP — наверняка, вы уже слышали об этой технологии, продвигаемой Google. Казалось бы, еще одна модная технология для хипстеров, о которой скоро все забудут. Однако, в реальности эта фича уже работает в продакшне значительного числа новостных сайтов, среди которых такие гиганты, как the Guardian, Times, Washington Post, и прочая, прочая, прочая. Краткий рассказ о плюшках AMP уже был на страницах “Хабра”, а я хотел бы чуть более подробно сфокусироваться на том, как внедрять это в проект, и какой профит в действительности можно получить.
Читать дальше →

Советы, библиотеки и дополнительные материалы по CSS-анимации

Время на прочтение25 мин
Охват и читатели68K
Советы, библиотеки и дополнительные материалы по CSS-анимации

Введение


Была глубокая ночь. В темную комнату через деревянные окна проникал лунный свет. Он недостаточно освещал мой деревянный стол с ноутбуком, блокнотом и синей ручкой. Поэтому я протянул свою руку к настольной лампе и включил её.

На компьютере был открыт текстовой файл со списком статей и библиотек про веб-разработку. Он постоянно пополнялся новыми данными.

Свернув его, я пошел на улицу в поисках кинотеатра с Deadpool'ом запустил браузер и стал блуждать по окрестностям интернета. Во время прогулки я наткнулся на интересную js-библиотеку по созданию css-анимации, которую добавил в открытый до этого текстовой документ… Как оказалось, по этой теме у меня уже набралось больше 40 ссылок на материалы и библиотеки.
Читать дальше →

Туториал по Jade для начинающих

Время на прочтение8 мин
Охват и читатели231K


Jade — это препроцессор HTML и шаблонизатор, который был написан на JavaScript для Node.js. Проще говоря, Jade — это именно то средство, которое предоставляет вам возможность написания разметки совершенно по новому, с целым рядом преимуществ по сравнению с обычным HTML.
Читать дальше →

Используем возможности CSS4 уже сегодня с cssnext

Время на прочтение3 мин
Охват и читатели38K
cssnextВот уже на протяжении четырёх лет, с сентября 2011 г. W3C занимается разработкой CSS4. Модули четвёртой версии каскадных таблиц стилей проектируются на базе CSS3 и дополняют их новыми свойствами и значениями. В этой статье я хотел бы рассказать о том, как использовать возможности CSS4 уже сегодня, о cssnext.

Итак, cssnext — это CSS компилятор, позволяющий использовать последний синтаксис CSS уже сегодня. Он преобразует новые CSS спецификации в более современный код так, что вам не придётся ждать поддержки новых возможностей в вашем браузере.
Читать дальше →

Shadow DOM

Время на прочтение7 мин
Охват и читатели70K
Ссылка на стандарт: www.w3.org/TR/2013/WD-shadow-dom-20130514

Итак, что же такое shadow DOM:
Shadow DOM (или теневая модель документа) — часть документа, реализующая инкапсуляцию в DOM дереве. Она (теневая модель) является частью документа и встраивается непосредственно внутрь страницы.
Для упрощения отладки shadow DOM, в хроме можно включить отображение в веб-инспекторе (Settings — General — Show shadow DOM).

Надо заметить, что в стандарте реализуемая инкапсуляция называется функциональной, поскольку shadow DOM встраивается в документ и является одной из многих его частей, работающих «независимо» (более-менее независимо) друг от друга. Соответственно, при проектировании реализации, нужно было установить функциональные границы в дереве документа, чтобы как-то оперировать с множеством таких «независимых» фрагментов. Для решения проблемы инкапсуляции, и была введена новая абстракция — shadow DOM, позволяющая создавать несколько DOM деревьев в пределах одного родительского дерева и был разработан документ, описывающий ее.
Читать дальше →

Как я использую PostCSS

Время на прочтение4 мин
Охват и читатели74K
CSS-препроцессоры в своё время значительно облегчали работу по написанию CSS кода. Однако в некотором роде все они были несовершенны и имели значительные изъяны в работе. А потому на смену препроцессорам пришёл постпрепроцессор PostCSS.

Это довольно таки мощный инструмент, облегчающий работу с CSS. Постпрепроцессор уже сегодня используется в таких крупных компаниях как Twitter и Google. Кроме того, по сообщениям разработчиков Bootstap, пятая версия CSS-фреймворка вероятнее всего также будет написана на PostCSS.
Читать дальше →

Что стоит знать задумавшемуся о переходе на Ubuntu

Время на прочтение8 мин
Охват и читатели117K


Знакомый, в глаза не видевший Linux, но заинтересовавшийся опенсурсом, после выхода Ubuntu 10.10 попросил написать ему, "чем хорошо, чем плохо, какие осложнения, какие тонкости, как наладить отношения с вин7", чтобы он мог решить, нужно ли ему это счастье.


Сначала подумал "зачем буду писать текст, когда наверняка его уже сто человек написали — быстро нагуглю, пошлю ссылку, а потом уже на конкретные вопросы отвечать буду". Но затем обнаружил, что по запросам вроде "миграция на ubuntu" вываливаются гигантские мануалы с тонкостями настройки compiz, а недлинный текст для "неопределившихся" быстро найти не получается ни в интернете вообще, ни на ubuntu.com и ubuntu.ru (то есть все как и писал в предыдущем посте), ни на Хабре — вот и подумал, что пусть теперь хотя бы на Хабре будет.


Участники "Убунтариума" вряд ли узнают из текста что-то новое, зато они могут дополнить его в комментах (не претендую на звание гуру, так что много важного наверняка упустил), и тогда люди, которые позже введут в гугл что-то вроде "переход на ubuntu", найдут тут счастье.

Читать дальше →

Правила хорошего тона при написании плагина на jQuery

Время на прочтение7 мин
Охват и читатели32K
Правила хорошего тона при написании плагина на jQueryЯ написал уйму плагинов на jQuery. Если посмотреть код всех плагинов, сортируя их по дате публикации на github, то можно проследить эволюцию кода. Ни в одном из этих плагинов не соблюдены все рекомендации, которые будут описаны ниже. Все что будет описано, лишь мой личный опыт, накопленный от проекта к проекту.
Писать расширения на jQuery довольно просто, но если хотите узнать как написать их так, чтобы потом их было просто поддерживать и расширять, добро пожаловать под кат.
Читать дальше →

Информация

В рейтинге
Не участвует
Откуда
Кишинев, Молдова, Молдова
Дата рождения
Зарегистрирован
Активность

Специализация

Фронтенд разработчик
Средний
Vue.js
JavaScript
HTML
SCSS
Webpack
Pug
БЭМ
Адаптивная верстка
SVG
LESS