Часть 3

В первой части автор упомянул проблемы, связанные с созданием и размещением отзывчивых изображений, а также привел пример, в котором использовано свойство srcset, позволяющее помочь браузеру подобрать оптимальный источник, что значительно повышает скорость сайта. Однако при таком подходе существует одна проблема: для подбора подходящего исходника необходимо знать размер макета изображения. А мы не можем попросить браузер отложить выбор, пока не загрузятся и не интерпретируются HTML, CSS и JavaScript страницы. Поэтому нам нужно дать браузеру возможность оценить ширину отображения картинки с помощью еще одного нового атрибута: sizes.

Везде ли применимо проектное планирование

Любую деятельность компании или отдельного человека можно разделить на два состояния:

1. Я делаю (сделаю) что-то сейчас;
2. Я буду это делать в будущем.

Первое состояние очень популярно в торгово-закупочной деятельности:

• купить прямо сейчас;
• заказать прямо сейчас;
• позвонить прямо сейчас.

На вас сваливается десяток задач которые надо сделать прямо сейчас. Как правило, это задачи на «на пять минут», хотя иногда подготовка к выполнению самой задачи может занять и больше пары часов. Если такое происходит, тогда весь поток задач, которые надо сделать «прямо сейчас», останавливается, пока короткая задача не будет завершена, Однако, каким-то мифическим образом все такие задачи «рассасываются» к концу недели.

Эта статья основана на моей презентации с конференции BrazilJS в августе 2014 года. Она базируется на идеях, о которых я писал в блоге недавно, в основном, в связи с UX и производительностью.

Я хочу представить 7 действенных принципов для веб-сайтов, которые хотят применить JavaScript для управления UI. Эти принципы являются результатом моей работы как веб-дизайнера, но также как давнего пользователя WWW.

JavaScript бесспорно стал незаменимым инструментом для разработчиков фронтенда. Сейчас сфера его применения расширяется на другие области, такие как серверы и микроконтроллеры. Этот язык программирования выбрали престижные университеты, чтобы обучать студентов основам информатики.

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

• Должен ли JavaScript использоваться как замена функциям браузера: история, навигация, рендеринг?
• Умирает ли бэкенд? Нужно ли вообще рендерить HTML?
• Правда ли, что будущее за приложениями на одной странице (Single Page Applications, SPA)?
• Должен ли JS генерировать страницы на веб-сайте и рендерить страницы в веб-приложениях?
• Нужно ли использовать техники вроде PJAX или TurboLinks?
• Каково точное отличие между веб-сайтом и веб-приложением? Должно ли остаться что-то одно?

DirkLoechel наконец-то закончил работу над самой большой в истории сравнительной схемой космических кораблей из научно-фантастических произведений: художественных фильмов, сериалов и игр. Star Trek, «Звёздные войны», EVE Online и многие другие (полный список под катом). Все культовые корабли — они тут. Открывайте оригинал изображения 4268 x 5690 пикселов — и погружайтесь.

По мотивам недавно прошедшей конференции в ЯрГУ 25 марта, на которую пришло уж очень немного народу, решил я написать небольшой мотивирующий пост для студентов и начинающих программистов/IT специалистов. Мою презентацию с доклада можно посмотреть на skydrive. Здесь же я постараюсь вкратце, на сколько это возможно, осветить этот доклад.

Это чисто мой полет мыслей, ни на какое откровение или новизну я не претендую. Начал я его писать сразу же после конференции (месяц назад), но все как-то не мог закончить. Радует безумно, что кроме меня со студентами и начинающими разработчиками хотят делиться все. Вот только в последние пару недель замечено два топика с похожими темами (и тоже стенограммы с конференций):

• Александр Бындю – Карьера в IT
• Яков Сироткин – Как стать героем

Ну и до нас не раз еще поднимали эту тему. Рекомендую читать и заряжаться всеми этими топиками.

Эм, а можно немного подвинуть розовую область?

В повседневной жизни мы постоянно пытаемся всё оценивать: сколько мне нужно времени, чтобы добраться на работу? Сколько денег я трачу в месяц? Достаточно ли у меня еды для предстоящей большой вечеринки? И так далее…

Кажется, постоянная оценка всего вокруг — это часть нашей жизни. Так что не удивительно обнаружить то же самое и в разработке ПО.

Хочу поделиться опытом подключения платежей с проверкой на сервере к приложению из Google Play.

Итак. У нас есть приложение, готовое для публикации (ссылка). Так же создан платёжный проект (ссылка) и связан с приложением.

В рамках нового HL я буду рассказывать о максимально совершенном HA. Если вы думаете, что HA сводится к балансировке на фронте, ipvs, выводу и вводу нод в рамках ролей — вы очень сильно ошибаетесь. Полноценный HA — это труд огромного количества людей, это огромные ресурсы, и, что важнее — внимание в каждой мелочи. Данный пост был создан для того, чтобы стало понятно, как влияние людей проецируется на проекты. Я прошёл много проектов,. am.ru был финалом моего понятия о крутых и финалом о «как не надо».

Итак, вы запустили рекламную кампанию, и трафик пошел на посадочные страницы. Для того, чтобы конвертировать посетителей в покупателей/подписчиков и т.д. (в зависимости от целей), ваша задача — создать посетителю все условия для совершения желаемого действия. Прежде, чем искать секреты и фокусы, которые поднимут конверсию, стоит пройтись по базовым принципам.

Базовые элементы лендинг пейдж можно условно сгруппировать как “дизайн” и “копирайтинг” составляющие. Дизайн — это сердце, он будет порождать эмоции, направлять внимание и притягивать к самому главному — к призыву к действию. Копирайтинг — это мозг, текстовая подача аргументов и фактов, описание предложения, которое либо склонит посетителя к выполнению определенного действия, либо заставит закрыть страницу и отвергнуть ваше ценное предложение на веки вечные. C чего начать?

Для реализации функционала видео-чата в браузере существует две наиболее подходящие из технологии — WebRTC и Flash. Каждая из технологий обладает рядом своих особенностей, например, во Flash можно использовать видео кодеки H.264 или Sorenson, а в WebRTC на текущий момент доступен VP8, что делает два этих подхода плохо совместимыми друг с другом (перекодирование видео на лету — это очень затратная операция), к тому же видео-чат лучше делать peer-to-peer по возможности, стоит ли говорить, что соединить Flash и WebRTC напрямую не выйдет. В нашем примере мы рассмотрим вариант видео-звонка звонка из WebRTC в WebRTC, с помощью платформы VoxImplant. В целом, можно сделать выбор конкретного варианта, вплоть до динамического выбора технологии в зависимости от того кому звоним. Подробности, как обычно, под катом.

Браузер Google Chrome поставляется с превосходными инструментами для разработчика, они же есть в Яндекс.Браузере, новой Опере, и в других браузерах, основанных на базе Chromium.

Среди них есть потрясающие инструменты для работы с памятью, ознакомиться с которыми можно в статье пользователя Panya — «Как находить и устранять утечки памяти на примере Яндекс.Почты».

Javascript хранит объект в памяти до тех пор, пока на него есть хоть одна ссылка. Как только вы удаляете все ссылки на объект, он уничтожается сборщиком мусора.

Таким образом, чтобы удалить объект, нужно удалить все ссылки на него.

Это кажется очень простым, но есть несколько достаточно неожиданных «мест» где могут храниться ссылки на объекты, тем самым задерживая их удаление, и создавая утечку памяти.

В продолжение темы, начатой в предыдущей статье, хочу поделиться своим опытом экспорта данных, в частности, в формате XLSX.



Итак, кому интересно, как заполнить XLSX без больших и сложных библиотек, прошу под кат.

Как утверждает сама команда разработчиков, Ractive.js — это библиотека для разработки динамичных web интерфейсов, благодаря которой в мире web-разработки наступит расцвет: всем выдадут бонусы в 100%, холивары «кто круче» отступят в сторону, а разработчики, которые пишут интерактивные, динамичные сайты наконец то перестанут покрываться сединой и материться.

Короче, наступит бриллиантовый век веб-разработки.

Начиная очередной проект, прежде чем начать писать Backbone код (фу-фу-фу), решил применить это чудо в проекте (бриллианты!). А так как погуглив похабрив я понял, что на хабре всего одна статья о Ractive.js, нужно устранить эту несправедливость и заодно написать о том, правда ли нам всем свалится вагон счастья и будет ли вообще кто-то доволен. Ведь пообещать «диамантовый век» — это одно (каждые 4 года из телеков слышим), а сделать — совсем другое.

Под катом рассмотрю, что такое и как работает Ractive.js, и подробно распишу продакшн задачу с полной реализацией и описанием, чем это всё грозит уже всем нам.

Tint

Сегодня можно констатировать взлет такой под-области node-ориентированных разработок как написание десктопных приложений на node-webkit или похожих фреймворках. Идея такого подхода выглядит достаточно просто: запаковываем среду исполнения Node вместе с небольшой программой, которая предназначена для запуска вашего Node приложения как если бы оно было родным, десктопным.

Это перевод поста «Front-end Choice Paralysis» Addy Osmani, опубликованный 1 июля 2014 года.

Во фронтенд-разработке мы постоянно сталкиваемся с такой проблемой, как изобилие выбора. Мы видим избыток инструментов, фреймворков, языков, абстракций и платформ. Такой выбор — это, безусловно, хорошо для конкуренции и дальнейшего развития, однако, сталкиваясь с таким количеством вариантов, можно впасть в ступор. Вместо того чтобы сделать свой выбор, чувствуешь себя брошенным, с чувством неопределенности перед огромной кучей вариантов. Это не обязательно проблема отрасли фронтенд-разработки – эта проблема человеческой природы.

Что случается, когда аналитик сталкивается с абстрактными художественными понятиями? А если от них зависит эффективность и успешность его работы? Он попытается их формализовать, выявить критерии, связи и так далее. Обычно получается забавно и очевидно. Но иногда из этого вырастает полезная теория.
Я столкнулся с понятием красоты сайта. Делюсь наработками.
Картинки для привлечения внимания нет.

Сегодня JavaScript лежит в основе большинства современных веб-приложений. При этом за последние годы появилось большое количество JavaScript-библиотек и фреймворков для разработчиков Single Page Application (SPA), графики, анимации и даже серверных платформ. Для веб-разработки JavaScript используется повсеместно, и поэтому качество кода обретает всё большее значение.

На первый взгляд, этот язык может показаться довольно простым. Встраивание в веб-страницу базового функционала JavaScript — это не проблема для любого опытного разработчика, даже если он ранее не сталкивался с этим языком. Однако это обманчивое впечатление, поскольку JavaScript гораздо сложнее, мощнее и чувствительнее к нюансам, чем кажется поначалу. Немало тонкостей в этом языке приводит к большому количеству распространённых ошибок. Сегодня мы рассмотрим некоторые из них. На эти ошибки нужно обратить особое внимание, если вы хотите отлично программировать на JavaScript.

Graphana — первый действительно хороший дашборд для отображения метрик.