Как стать автором
Обновить

Twitter обновил дизайн десктопной версии сайта

Дизайн Социальные сети и сообщества


Twitter обновил десктопную версию сайта и убрал возможность перейти на старый дизайн. Протестировать новый внешний вид можно было в последнии месяцы, сейчас компания перешла в активную стадию и раскатывает обновление на всю аудиторию.
Всего голосов 12: ↑11 и ↓1 +10
Просмотры 2.5K
Комментарии 9

Mozilla отказалась от поддержки PWA в Firefox 85

Firefox Разработка веб-сайтов *Браузеры

В обновлении Firefox 85 компания Mozilla отказывается от поддержки прогрессивных веб-приложений. Об этом в багтрекере Bugzilla рассказал разбрабочик Дейв Таунсенд.

Читать далее
Всего голосов 16: ↑15 и ↓1 +14
Просмотры 16K
Комментарии 28

Митап VK и Google: обсуждаем Chrome Dev Summit и новые технологии в веб-разработке

Блог компании VK Разработка веб-сайтов *Google Chrome Веб-аналитика *Конференции

2 декабря в 18:00 обсудим недавний форум Chrome Dev Summit и новые технологии веб-разработки.

Встреча пройдёт в формате дискуссии. Разработчики из разных проектов VK и эксперты из Google обсудят PWA (Progressive Web Applications) и CWV (Core Web Vitals). Регистрируйтесь, и ждём встречи!

Читать далее
Всего голосов 4: ↑4 и ↓0 +4
Просмотры 955
Комментарии 0

Progressive Web Apps: WhoAmI

JavaScript *Разработка мобильных приложений *Разработка под Android *
Интерес к разработке приложений для мобильных операционных систем в сообществе разработчиков стабильно растёт, количество инструментов и подходов позволяющих создавать приложения становится всё больше. Сегодня я хочу написать о одном из новых подходов, а именно о Progressive Web Apps.



Читать далее
Всего голосов 17: ↑12 и ↓5 +7
Просмотры 94K
Комментарии 13

Air Berlin: реализация Progressive Web App

Блог компании Google Developers Разработка веб-сайтов *Разработка мобильных приложений *Разработка под Android *
Перевод
Привет, Хабр! На прошедшей 18 мая в Калифорнии юбилейной конференции для разработчиков Google I/O было много всего. Серьёзные штуки для Android, монументальные изменения и интеграции в продуктах Firebase, да и просто множество анонсов и классных технологий. Но кое-что ещё мы пока не обсуждали. Речь идёт о Progressive Web App’ах (современных веб-приложенях) — сайтах, написанных так, словно это современные мобильные приложения: удобные, простые, интуитивно понятные и комфортные для использования на сенсорном дислпее.

Поэтому в ближайшие два месяца мы собираемся не только публиковать статьи по теме PWA, но и провести тематическую онлайн конференцию 11 октября — Progressive Web Apps Day. Пока же предлагаем вашему вниманию реальный кейс использования PWA от AirBerlin.


Читать дальше →
Всего голосов 22: ↑20 и ↓2 +18
Просмотры 19K
Комментарии 7

Секреты Progressive Web Apps: часть 1

Блог компании Google Developers Разработка веб-сайтов *JavaScript *Разработка мобильных приложений *Разработка под Android *
Tutorial
Привет, Хабр! Мы продолжаем цикл статей по Progressive Web Apps. В прошлый раз мы познакомили вас с опытом разработчиков из Airberlin, ну а сегодня у нас в виртуальных гостях Jan Lehnardt, человек, стоящий за такими штуками, как Hoodie, Apache CouchDB и Greenkeeper i/o.

И пусть вас не смущает аббревиатура PWA (Progressive Web Apps): несмотря на то, что в заголовке есть Apps, принципы и технологии, используемые в PWA, применимы в целом к вебу и к приложениям. Лучшим вступлением к статье будет просмотр видео с Google I/O 2016, в котором Джейк Арчибальд рассказывает о PWA.



Я очень рекомендую посмотреть его, прежде чем продолжать читать статью, особенно если эта тема для вас в новинку.
Читать дальше →
Всего голосов 9: ↑8 и ↓1 +7
Просмотры 25K
Комментарии 3

Онлайн конференция Google: Progressive Web Apps Day (11 октября)

Блог компании Google Developers Разработка веб-сайтов *Разработка под Android *Тестирование мобильных приложений *
Приветствуем! Приглашаем всех присоединиться 11го октября в 11:00 (МСК) к онлайн конференции Google по теме Progressive Web Apps.


Читать дальше →
Всего голосов 9: ↑9 и ↓0 +9
Просмотры 5.1K
Комментарии 2

Онлайн трансляция Progressive Web Apps Day начинается

Блог компании Google Developers Разработка веб-сайтов *Разработка мобильных приложений *Разработка под Android *
Друзья, присоединяйтесь к прямой трансляции онлайн конференции Progressive Web Apps Day.


Читать дальше →
Всего голосов 34: ↑34 и ↓0 +34
Просмотры 3.6K
Комментарии 0

Секреты Progressive Web Apps: часть 2

Блог компании Google Developers Разработка веб-сайтов *Разработка под iOS *Разработка мобильных приложений *Разработка под Android *
Для тех, кто пропустил первую часть статьи: вам сюда. Ну а для всех остальных, как обычно, привет, Хабрахабр. Мы продолжаем тему PWA и изучение базового алгоритма синхронизации (не бросать же начатое?). В прошлой части мы закончили на том, что наше условное приложение умеет запрашивать статьи с сервера, получать только актуальные материалы, следить за изменениями и удалениями статей и грамотно всё это обрабатывать. Работало это всё через вычисление дельты: разницы между тем, что есть у приложения, и тем, что хранится на сервере.



В этой части мы изучим различные конкретные схемы по реализации описанных выше теорий, обсудим их сильные и слабые стороны. Ну а перед тем как мы начнём, давайте опишем требования к искомым алгоритмам.
Читать дальше →
Всего голосов 11: ↑11 и ↓0 +11
Просмотры 6.6K
Комментарии 1

Некоторые тонкости использования Service Workers

Разработка веб-сайтов *Тестирование веб-сервисов *


Предисловие


Сервис-воркеры (Service Workers, да простят меня читатели) сегодня являются полезным дополнением к основной функциональности сайта: тут и работа в оффлайне, и фоновая синхронизация данных, и модные пуш-уведомления.

Однако большое количество статей про сервис-воркеры выглядят достаточно сжато и описывают простые примеры. Я попробую обратить внимание на некоторые особенности работы сервис-воркеров, так что требуются какие-то базовые знания. Отправной точкой может быть эта статья (перевод) или чуть более подробная статья.
Читать дальше →
Всего голосов 36: ↑30 и ↓6 +24
Просмотры 24K
Комментарии 7

PWA, «Зловещая долина» и стабильная работа в офлайне

Блог компании WEBO Group Анализ и проектирование систем *Клиентская оптимизация *Разработка мобильных приложений *Проектирование и рефакторинг *
Перевод
В июле прошлого года на Altitude 2016 Алекс Рассел (Alex Russell) из Fastly рассказал, как он видит будущее мобильных приложений с учетом PWA и service worker, как обеспечить надежную работу приложения в офлайне и как обойти «зловещую долину» в мобильном интерфейсе.

Сейчас service worker — это программируемое прокси внутри браузера


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

Такая закономерность проиллюстрирована на рисунке 1. Хорошо видно, что с увеличением времени загрузки веб-страницы:

1) сильно падает количество обращений к странице;
2) постоянно растет процент отказов.


Рис. 1. Быстрее всегда лучше
В виде столбиковой диаграммы показана зависимость количества обращений к веб-странице за секунду от времени загрузки (этой страницы также в секундах.
В виде красного графика показана зависимость показателя отказов в процентах от того же времени загрузки в секундах веб-страницы

Читать дальше →
Всего голосов 17: ↑16 и ↓1 +15
Просмотры 8K
Комментарии 1

Favicon сегодня: форматы, поддержка, автоматизация

Разработка веб-сайтов *HTML *
Recovery mode
Из песочницы
На сегодняшний день favicon — это не просто значок 16x16 во вкладке браузера. Он является важной составляющей интерфейса, а также играет немаловажную роль в прогрессивных веб-приложениях. Существует немало способов подключения и использования favicon, о которых я расскажу в данной статье.



Читать дальше →
Всего голосов 53: ↑50 и ↓3 +47
Просмотры 122K
Комментарии 24

Как сделать Progressive Web Apps: руководство новичка

Блог компании Нетология Разработка веб-сайтов *Разработка мобильных приложений *
Перевод
Tutorial
Светлана Шаповалова, редактор блога «Нетологии», адаптировала статью пользователя uve, в которой рассказывается, как сделать Progressive Web Apps.

Уверен, вы слышали о Progressive Web Apps, или сокращенно PWA. Не буду вдаваться в подробности о том, что это и как работает. Для наших целей подойдет простое определение PWA — сайт, который можно добавить на главный экран телефона, и он будет работать в автономном режиме.



Мне знакомы HTML, CSS, JavaScript и я умею пользоваться GitHub. Однако я все еще новичок в веб-разработке и мне не всегда охота глубоко вникать в принципы работы того или иного явления. Чаще всего мне просто нужен понятный способ сделать нужную вещь, не просматривая при этом тонны статей. Поэтому я надеюсь, что этот пост даст вам все необходимое для создания собственного PWA.
Читать дальше →
Всего голосов 7: ↑5 и ↓2 +3
Просмотры 70K
Комментарии 3

Дайджест интересных материалов для мобильного разработчика #215 (31 июля — 5 августа)

Блог компании Productivity Inside Разработка под iOS *Разработка мобильных приложений *Разработка игр *Разработка под Android *
В новом дайджесте мы разбираем Android на части, спорим с Apple по поводу PWA, смотрим, как делается новостной агрегатор, исследуем Firebase, учимся на дизайнеров интерфейсов, возвращаем и вознаграждаем пользователей.

Читать дальше →
Всего голосов 15: ↑13 и ↓2 +11
Просмотры 9.6K
Комментарии 0

Android Oreo откусывает кусочек от PWA

Блог компании Zfort Group Разработка веб-сайтов *Google Chrome HTML *Google API *
Перевод


PWA (Progressive Wep Applications) – это название группы приложений, разработанных и продвигаемых компанией Google, которые используют стек Web технологий (JS + HTML + CSS) и позволяют соединить простоту использования Web сайта со специфичными для нативных приложений операционной системы UX и техническими возможностями. — прим. переводчика.

21 августа, после солнечного затмения, Google анонсировал выход финальной версии Android 8 под названием Android Oreo. Вместе с этим, у прогрессивных веб приложений появились новые проблемы.

Я установил Android 8 на свой Google Pixel и протестировал несколько вещей, касающихся, веб-сайтов и прогрессивных веб приложений, после чего у меня появились несколько плохих новостей.
Всего голосов 19: ↑18 и ↓1 +17
Просмотры 13K
Комментарии 16

Современная Web-платформа: как расслабиться и получать удовольствие? Практическое руководство, часть 1

Разработка веб-сайтов *JavaScript *Браузеры
Tutorial

Всем привет!


Помните эту статью? Раньше мы могли быстро собрать статичную HTML-страничку в каком-нибудь FrontPage и сайт был готов. С этим мог справится любой студент. В более сложном случае, мы писали пару строк на PHP и получали уже целый портал, собранный из разных элементов шаблона на сервере. Затем мы захотели, чтобы наш сайт как-то выделялся на общем фоне и умел чуть-чуть больше. Трон занял его-величество jQuery. Теперь же, мы оказались погребены под завалами фреймворков и библиотек, инструментов сборки, менеджеров зависимостей, препроцессоров и постпроцессоров, особых форматов, языков и стилей программирования, чтобы иметь возможность стряпать простые лэндинги. Все стало слишком сложно. Спикеры на конференциях стали соревноваться в изощренности того, каким еще образом можно сломать нам мозг. Как мы докатились до жизни такой? Чем «раньше» так сильно отличается от «сейчас»? Что нас ждет «потом»? Есть ли в современной веб-разработке некий дзен-стайл, блюдя который, можно, как в старые добрые времена, собрать себе уютный сайтик «на коленке» за пару вечеров, без ковыряния в документации десятка хипстерских технологий-однодневок? Насколько доступны нам простые решения в серьезной промышленной разработке? Куда движется веб-платформа? Предлагаю разобраться.
Читать дальше →
Всего голосов 18: ↑16 и ↓2 +14
Просмотры 23K
Комментарии 73

Хакатон для всех от GDG & WTM Moscow

Блог компании Google Developers Хакатоны


24-26 ноября в «Доме-Коммуне» состоится хакатон для всех, организованный IT-сообществами: Women TechMakers & Google Developers Group Moscow. Соорганизаторами мероприятия являются ВЭБ и МИСиС. Для участников будут доступны разные номинации от таких компаний партнеров как Google, App in the Air, ВЭБ. Участие в Хакатоне полностью бесплатное, но по предварительному отбору.

Читать дальше →
Всего голосов 8: ↑8 и ↓0 +8
Просмотры 2.8K
Комментарии 2

Впечатления от Angular Connect 2017

Разработка веб-сайтов *JavaScript *Angular *
Собрал в кучу свои впечатления от конференции, которая прошла 7-8 ноября.

В основном, на конференции речь шла про все что происходит вокруг фреймворка или что можно сделать с его помощью или на его основе. Это дает ощущение, что основная работа по развитию завершена. В 5 версии ребята здорово поработали над оптимизацией размера. Про какие-то изменения в ядре не упоминалось.

image
Всего голосов 16: ↑16 и ↓0 +16
Просмотры 6.6K
Комментарии 0

Хакатон в прямом эфире. Ускоряем мобильные сайты

Блог компании Google Developers Разработка веб-сайтов *Монетизация веб-сервисов *



В январе на страницах главного блога вебмастеров Google было объявлено, что с июля 2018 года скорость загрузки страницы станет ранжирующим сигналом в мобильном поиске. Исследования подтверждают важность быстрой загрузки мобильных версий сайта не только для поиска, но и для бизнеса в целом: при замедлении скорости загрузки с 1 до 7 секунд, показатель отказов увеличивается на 113%, уровень конверсии падает на 95% при увеличении числа элементов на странице с 400 до 6000.


Узнать о том, как оптимизировать скорость загрузки сайта можно будет 14 февраля на первом в России онлайн-хакатоне "Ускоряем мобильные сайты". Специалисты и инженеры Google расскажут какие критические ресурсы стоит оптимизировать в первую очередь, продемонстрируют как это можно сделать на реальном сайте, а также ответят на все интересующие вас вопросы. Для участия в хакатоне необходимо зарегистрироваться.

Читать дальше →
Всего голосов 26: ↑25 и ↓1 +24
Просмотры 3K
Комментарии 1

Генерация страниц сайта средствами сервис-воркеров

Блог компании VK Разработка веб-сайтов *JavaScript *HTML *
Tutorial

(С)

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

  • кэширование страниц сайта для офлайн доступа;
  • ведение учета страниц, доступных офлайн, проброс необходимых данных;
  • мониторинг статуса сети, онлайн или офлайн;
  • общение сервис-воркера со страницами и вкладками, которые он обслуживает;
  • перехват сервис-воркером запроса на открытие адреса /offline/ и генерирование новой страницы прямо на устройстве, без запроса к серверу.

Если тема сервис-воркеров и Progressive Web Apps (PWA) для вас новая, то перед чтением этой статьи необходимо познакомиться с ними поближе.

Меня зовут Рыбин Павел, я работаю во фронтенд-разработке Медиапроектов Mail.Ru Group. Это руководство мне помогали писать грабли, набитые шишки и подводные камни, попавшиеся мне при реализации PWA для мобильной версии Авто Mail.Ru.

В тексте будут встречаться небольшие примеры кода, иллюстрирующие рассказ. Расширенную же демо-версию можно посмотреть на GitHub.
Читать дальше →
Всего голосов 39: ↑39 и ↓0 +39
Просмотры 18K
Комментарии 12