Какой рейтинг вас больше интересует?
|
Главная / Главные темы / Тэг «e53»
Front-end и блокировщики рекламы (на примере Adblock Plus) 2016-12-02 07:26:00
Хочу поделиться небольшим опытом работы с блокировщиками рекламы со стороны front-end разработчика. ...
+ развернуть текст сохранённая копия
Хочу поделиться небольшим опытом работы с блокировщиками рекламы со стороны front-end разработчика. Все понимают, что наша задача сделать так, чтобы сайт нормально работал и выглядел при любых настройках пользователя, на любых устройствах. Я иногда посматриваю постоянно проверяю как выглядит сайт при отключенном javascript, проверяю работу на touch-устройствах, устройствах с маленьким разрешением итд. итп. После того, как у нас на сайте из-за Adblock Plus (далее по тексту просто Adblock) перестал работать видео-плеер — стало понятно, что наличие блокировщика рекламы также нужно учитывать при верстке сайта…
Читать дальше →
Тэги: front-end, html, javascript, браузеров, браузеры, веб-сайтов, верстка, разработка, расширения, сайтов
9 способов оптимизации производительности Front-End 2016-12-01 13:59:30
Поскольку современные браузеры стали поддерживать больше возможностей, а веб-индустрия стремительно ...
+ развернуть текст сохранённая копия
Поскольку современные браузеры стали поддерживать больше возможностей, а веб-индустрия стремительно перемещается в сторону мобильных устройств, появилась необходимость писать компактный и оптимизированный код, который не заставит долго ждать пользователя, пока загрузится сайт. Front-end хорош тем, что в нем содержится много простых стратегий и конвенций кода, которые мы можем использовать для обеспечения оптимальной производительности. В этой статье мы собрали 9 простых советов, которые помогут с оптимизацией кода.
Сразу должен сказать, что часть приемов было подсмотрено нами на западных просторах интернетов, а часть добавили мы. В любом случае, в рунете такого материала не было. Нам часто приходится писать большие системы и оптимизировать скорость загрузки, поэтому стараемся бороться за каждый байт. Отсюда и решили написать про эту важную тему.
Читать дальше →
Тэги: ajax, animations, api, array.prototype.join, css, curl.js, data, documentfragments, dom, front-end, image, innerhtml, insights, javascript, jquery, json, media, pagespeed, queries, src, url, веб-сайтов, высокая, клиентская, оптимизация, программирование, производительность, разработка
[Из песочницы] Инструментарий для front-end разработки под Linux 2016-10-13 10:08:40
Доброго времени суток, господа девелоперы! В этой статье я расскажу, как сделать разработку под ...
+ развернуть текст сохранённая копия
Доброго времени суток, господа девелоперы! В этой статье я расскажу, как сделать разработку под Linux действительно комфортной и удобной, чтобы она приносила только боль удовольствие.
Чего мы добиваемся:
Просматриваем страницу в браузере и правим в текстовом редакторе HTML и CSS/SASS. Код извлекаем напрямую из PSD, попутно корректируя до PixelPerfect прямо в браузере. При сохранении SASS автоматически преобразуется в CSS и загружается на сервер. Необходимые картинки из PSD шаблона вырезаем в два клика, после чего они так-же автоматически загружаются на сервер. Как этого добиться менее чем за пол часа? Я расскажу вам!
Сразу хочу предупредить вас, если ваш опыт работы более нескольких лет и вы являетесь достаточно опытным front-end'ером, то ничего нового вы в этой статье не найдете. Она предназначена для людей, которые относительно недавно присоединились к GNU/Linux сообществу или только решили к нему примкнуть.
Краткое содержание
- Выбор браузера
- Установка расширений для Firefox
- Выбор текстового редактора
- Необходимые расширения для Sublime Text 3
- Дополнительные инструменты и оптимизация системы
Читать дальше →
Тэги: css, firefox, front-end, frontend, html, html-верстка, html5, javascript, sublime, text, веб-сайтов, разработка
[Перевод] Двенадцать полезных Chrome DevTools Tips 2016-10-03 11:36:33
В данной статье мы рассмотрим некоторые функции инструментов разработчика Chrome. Конкретно я ...
+ развернуть текст сохранённая копия
В данной статье мы рассмотрим некоторые функции инструментов разработчика Chrome. Конкретно я использую Chrome Canary и вам советую. И не потому, что это отсылка на маленьких милых птиц, которые пожертвовали своими жизнями чтобы мы могли добывать свежий уголь.
Некоторые из DevTools функций вы возможно не знали. Я буду очень счастлив, если хотя бы одну из них вы найдете для себя полезной.
(В статье ниже присутствуют анимированные гифги, которые начинают раздражать после первого цикла. Поэтому я советую открыть dev tools и удалить DOM ноды, которые отвечают за изображения.)
Итак, поехали:
Копируем переменную в буфер обмена
Об этой возможности я узнал из комментариев, и считаю ее достаточно полезной чтобы быть описанной в начале. Иногда бывает нужно скопировать содержимое переменной в буфер обмена. Например html код или json объект. Для этого можно использовать copy функцию.
copy (someVariable)
Теперь текстовое представление переменной скопировано в буфер обмена.
Читать дальше →
Тэги: chrome, devtools, front-end, google, javascript, блог, браузеры, веб-сайтов, инфопульс, компании, производительность, разработка, украина
Redux Action Creators. Без констант и головной боли 2016-09-26 12:35:12
< ...
+ развернуть текст сохранённая копия
Всем привет! Эта статья будет полезна тем, кто устал использовать constants в Redux (частично показано на превью выше). Под катом я покажу очередной возможный велосипед и как на нем кататься.
Читать дальше →
Тэги: development, front-end, frontend, javascript, npm, react, reactjs, redux, веб-сайтов, разработка
Главная / Главные темы / Тэг «e53»
|
Взлеты Топ 5
Падения Топ 5
|
