Рубрика «pwa» - 2

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

metalz.web.app

Под катом рассказ о том, как я переписал приложение с react-native на Svelte и опубликовал его в Google Play.

Читать полностью »

Технологии, которые будут популярны в 2020 году - 1

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

Если вам любопытно, каким может оказаться будущее для мира программирования, то вы по адресу. Возможно, я ошибаюсь по каждому пункту — не считайте мои слова непогрешимой истиной — однако ниже я изложу свои соображения о том, что нас ждет. Дара провидения у меня нет, но я могу сделать некоторые предположения на основании доступных данных.
Читать полностью »

image

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

“Так исторически сложилось” считать мобильные версии урезанными. Так действительно было, даже с приходом полноценных браузеров в мобильные телефоны. Но уже прошло очень много времени и пора пересмотреть отношение к мобильным веб-сайтам.
Читать полностью »

Апрель — месяц субботников. Наша команда тоже провела  виртуальный субботник и навела порядок с некоторыми вопросами на Хабре — а значит, у нас для вас снова есть порция новостей. Сегодня мы проводим очередную сессию вопросов и ответов (AMA). Пользователи Хабра и команда Хабра могут поболтать по делу и без. Если кто-то забыл посмотреть в календарь, сегодня последняя пятница апреля, а значит, пора: вам — задавать вопросы и писать предложения, нам — только успевать отвечать на них и пополнять бескрайний беклог.

AMA с Хабром v.8.0. Онбординг, новости для всех, PWA - 1
Читать полностью »

Play Store теперь принимает прогрессивные веб-приложения (PWA) - 1

Дисклеймер: я не связан с Google Play, Chrome или любой упомянутой компанией. Это не официальное заявление. Логотип и названия используются только для иллюстрации.

В Chrome 72 для Android реализована долгожданная функция Trusted Web Activity. Это означает, что теперь мы можем распространять PWA через каталог Google Play и запускать Chrome без UI в автономном режиме для нативных пакетов! Я некоторое время поигрался с этой функцией, копаясь в API, а здесь расскажу, о чём речь, чего ожидать и что доступно уже сегодня.
Читать полностью »

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

По правде говоря, я ничего не понимаю в комиксах, но люблю барахолки, особенно в формате форума, какие были популярны в нулевых. Отсюда, допущение (возможно ложное), из которого проистекают последующие выводы, только одно — основной тип взаимодействия с приложением — просмотр, второстепенные — размещение объявлений и обсуждение.

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

Читать полностью »

Привет!

Продолжаем битву за производительность Javascript на примере построения сводных таблиц. В прошлый раз мы реализовали несколько оптимизаций, и оставалась последняя реальная возможность ускорить расчет — перейти на многопоточные вычисления. В Javascript уже давно существуют воркеры, реализация которых не лишена недостатков, но заявлено, что они используют реальные потоки операционной системы — так почему бы не попробовать? Неожиданно оказалось, что для распараллеливания простого, в сущности, алгоритма пришлось переписать синтакис агрегатных формул, так как старые не обладали свойстом аддитивности (подробнее под катом), но, в конечном итоге, все получилось.

Тестировалась обработка 1 миллиона фактов на двух устройствах:

  • Нетбук Linux 4.15, 2 x Intel Celeron CPU N2830 @ 2.16 GHz
  • Телефон Android 7.0, 4 x ARM Cortex-A53 @ 1.44 GHz

Многопоточные вычисления на Javascript, или как телефон выиграл гонку у ноутбука - 1

Читать полностью »

Привет!

Продолжаем битву за производительность Javascript на примере построения сводных таблиц. В прошлый раз камнем преткновения стал асинхронный интерфейс IndexedDB, который, используя межпоточный вызов для каждой записи курсора, работает чудовищно медленно. Решив эту проблему путем организации крупноблочного хранения, а также применив все известные оптимизации, мне удалось поднять производительность приложения в 20 раз, и в настоящее время расчет по хранилищу в 1 миллион фактов занимает 21 секунду, что потенциально дает надежду догнать Америку Excel, который обрабатывает тот же миллион строк за 5..7 секунд.

Однопроходный алгоритм, не использующий индексы и вложенные запросы, отлично ложится на блочную схему хранения данных, и, самое обнадеживающее — позволяет распараллелить расчет по разным потокам (воркерам), по сути повторяя алгоритмы «взрослых» СУБД. Таким образом — возможности по оптимизации далеко не исчерпаны. В настоящее время расчет производится лишь одним воркером, WASM не используется, результаты «милионного» теста на различных браузерах следующие:

Браузер Время
Chomium Linux 21 сек
Firefox Linux 51 сек
Chrome Android 29 сек
Firefox Android 62 сек

В приложении доступен генератор тестовых данных, также можно загрузить собственный JSON и проверить цифры. Приложение в глубокой бетте, так что ошибки должным образом не обрабатываются, простите. Под катом — несколько кейсов по ускорению WEB-приложений, которые, конечно, все являются банальностями и очевидностями, просто я, как любитель учиться на собственных ошибках — их проверил, зафиксировал, и теперь стараюсь соблюдать.
Читать полностью »

Здравствуй!

Недавно я решил протестировать производительность Javascript на примере создания несложного WEB-приложения, умеющего строить сводные таблицы, вычислять агрегаты и подтягивать атрибуты из справочников, используя слабо-структурированные данные в качестве источника. Повторить весь функционал Excel или взрослых OLAP-систем не предполагалось, но хотелось протестировать производительность Javascript вообще и IndexedDB в частности на различных десктопных и мобильных браузерах. Забегая вперед, скажу, что выполнив первый этап работы — построение сводной таблицы однопроходным алготитмом по хранилищу фактов (индексирование часто-используемых разрезов и кэширование вычисленных агрегатов отложено на будущее) — я был разочарован производительностью чтения из IndexedDB, удивлен тем, что мобильные браузеры практически не отстают от десктопных, и озадачен эпическим провалом моего любимого Firefox в одном из тестов. Всего было 2 теста с различными вариациями:

  • формирование сводной таблицы, где основа алгоритма — единственный цикл по курсору IndexedDB, работа с объектами Object, Array, Set, Map (извлечение по ключу, вставка, итерация), конкатенация строк и простая арифметика;
  • расшифровка (drillthrough) строки сводной таблицы с выводом результата в DOM, где основа алгоритма — многократное (в цикле) извлечение одной записи из IndexedDB по ключу, и последующий вывод результатов в таблицу html группами по 100 строк методом insertAdjacentHTML('beforeEnd', html)).

Тестирование проводилось на файле JSON, содержащем 20 тыс. фактов, из которых 9 записей представляли собой справочник продуктов, остальные изображали операции купли/продажи. Табличка с результатами тестирования на нетбуке и телефоне (время в секундах), а также подробности реализации и выводы — под катом.
Читать полностью »

Первое знакомство

24 рецепта, как стартапу преуспеть на огромной мировой выставке, на примере Web Summit 2018 - 1

Для тех кого интересуют сами 24 рецепта — они в конце статьи.

Web Summit 2018 в Лиссабоне очень масштабное событие, я на таком присутствовал впервые и очень многое меня удивило. Во-первых то, что планируемое количество посетителей саммита 70К, при населении города 600К, то есть, в принципе, каждый десятый должен быть участником саммита. На самом деле, начинать ощущать масштаб мероприятия мы начали уже при подходе к метро. Просто толпы идут в одном направлении. Поэтому ошибиться в утренние часы в дни саммита — «а туда ли ты идешь?» — просто невозможно. Весь город идет на саммит. Следуйте за толпой.

Было приятно увидеть, что на всех схемах метро, на станции, на которой проходит саммит, есть наклейка с логотипом саммита — не заблудишься точно. На всех пересадочных станциях, везде указатели.

Очень много молодежи, видно, что с разных стран. Довольно много русской речи, многие уже имеют на груди бейджик Web Summit, значит прилетели на день раньше… А нет, приглядишься — ВСЕ имеют такой бейджик. Весь вагон. Вся станция метро.

Бейджик получаешь после регистрации на саммите. Кроме него, надевают еще тканевый браслет на руку. Потеряешь что-то одно из этого — придется выложить 100 евро, потеряешь оба — заново плати за входной билет 1500 евро! С браслетом можно мыться, проверено. Бейдж берегите.

Нам, как участникам, кстати, столько платить не пришлось, мы за все 3 билета заплатили меньше чем за один и еще получили стенд в эти деньги. Делать новые технологии выгодно!

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

Web Summit, начало

Регистрация занимает не больше минуты. И вот мы на саммите!
Читать полностью »


https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js