• Деобфускация одного скрипта с попапами

      Тяжело найти человека, который не сталкивался бы с таким отвратительным явлением на сайтах, как рекламный попап. Откровенно не понимаю зачем их делают, но, судя по всему, это работает. И это печально. В своё время данное явление достало даже разработчиков браузеров из-за чего на тот же window.open были наложены ограничения, не позволяющие открывать новые окна без спросу пользователя. К сожалению их было недостаточно и в борьбу включились баннерорезки. К сожалению API, предоставляемые браузерами, не идеальны и потому периодически обнаруживаются новые пути ухода от блокировки, которые как-то приходится затыкать. Вот только довольно сложно заткнуть брешь не зная как она работает и разработчики рекламных скриптов это тоже прекрасно понимают. В результате код обфусцируется всё новыми и новыми способами. Здесь я попробую разобрать один такой скрипт и техники обфускации кода, применяемые в нём, крайний раз обнаруженный на средней популярности сайте хентайной мангой (японские порнокомиксы).
      Читать дальше →
    • JavaScript, Node, Puppeteer: автоматизация Chrome и веб-скрапинг

      • Перевод
      Библиотека puppeteer для Node.js позволяет автоматизировать работу с браузером Google Chrome. В частности, с помощью puppeteer можно создавать программы для автоматического сбора данных с веб-сайтов, так называемые веб-скраперы, имитирующие действия обычного пользователя. В подобных сценариях может применяться браузер без пользовательского интерфейса, так называемый «Headless Chrome». Используя puppeteer, можно управлять и браузером, который запущен в обычном режиме, что особенно полезно при отладке программ.

      image

      Сегодня мы поговорим о создании веб-скрапера на базе Node.js и puppeteer. Автор материала стремился к тому, чтобы статья была интересна как можно более широкой аудитории программистов, поэтому пользу из него извлекут как те веб-разработчики, которые уже имеют некоторый опыт работы с puppeteer, так и те, которые впервые сталкиваются с таким понятием, как «Headless Chrome».
      Читать дальше →
    • We need to go deeper: обходим скрипт который обходит адблок


        Немного пятничный пост. В последнее время заметил что есть реклама которая пробивает сразу 2(!) расширения блокирующие её. И обычно это очень низкокачественная и навязчивая реклама. Решил разобраться как так, и, возможно, даже попробовать побороть эту дрянь. Кому интересно — прошу под кат (осторожно, много картинок).
        Читать дальше →
      • Оптимизация ES2015 Прокси в V8

        • Перевод


        Это перевод поста из официального блога JS-движка V8. Статья короткая, текста мало, больше похоже на увлекательный рассказ о проблемах, подстерегающих ни о чём не подозревающих сотрудников Google в коде V8. Речь пойдёт об ускорении обработки ES6 Прокси в V8, которое будет доступно в Chrome 62 и Node v9.x, и совсем немного о том, как лучше применять прокси для получения максимальной скорости работы.

        Введение


        Прокси появились в JavaScript с принятием стандарта ES2015. Они позволяют перехватывать фундаментальные операции объектов и переопределять их поведение. Прокси являются основой таких библиотек, как jsdom или Complink RPC library. В последнее время мы приложили много усилий, чтобы улучшить производительность прокси в V8. Эта статья проливает немного света на общие подходы к улучшению производительности в V8 и для прокси в частности.

        Читать дальше →
      • Web-приложения в Android без Cordova, Phonegap и SMS

          Начиная с 5 версии Android компонент WebView поставляется не как часть системы, а как обычное приложение которое может быть обновлено из Google Play:

          image

          Что это даёт разработчикам? Теперь HTML-приложения можно встраивать в .apk без дополнительных костылей. Все возможности HTML5 будут доступны.

          Рассмотрим пример публикации в Google Play реального HTML5 приложения.
          Читать дальше →
        • AdBlock похитил этот баннер, но баннеры не зубы — отрастут

          Подробнее
          Реклама
        • Обзор всех инструментов разработчика Chrome DevTools

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

          Отдельно бы хотелось отметить, что DevTools находится в постоянной активной разработке, поэтому название инструментов/панелей/вкладок, как и их наличие в целом или способ доступа к ним со временем может быть изменен. Поэтому не стоит пугаться если, на момент прочтения Вами этой статьи, DevTools будет незначительно отличатся от того, что указано в описании или на скриншотах в этой статье.
          Читать дальше →
          • +10
          • 17,8k
          • 1
        • Использование фронтенда профилировщика Chrome в собственных проектах

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

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

          Предыстория


          Для некоторой части нашей системы сборки кода мы когда-то написали простенький профилировщик (называется TinyProfiler). Он достаточно тривиален — замеряет время выполнения определенных блоков кода и создаёт набор HTML+SVG файлов, которые визуализируют эти данные в стиле flame-графов:

          image

          Это, в принципе, неплохо работало, но полученный HTML был не очень интерактивным. Можно было подвести мышку к определенному блоку и увидеть его название во всплывающей подсказке, но на этом все удобства и заканчивались. Не было ни зума, ни фильтрации, ни скрола, ни поиска — в общем ничего, чего хотелось бы получить от более-менее профессионального инструмента. Всё это можно было, конечно, сесть и написать, но… зачем же это делать, если можно этого не делать? Ведь уже есть кто-то (разработчики Chrome), кто всё это уже сделал.
          Читать дальше →
        • Android Oreo откусывает кусочек от PWA

          • Перевод


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

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

          Я установил Android 8 на свой Google Pixel и протестировал несколько вещей, касающихся, веб-сайтов и прогрессивных веб приложений, после чего у меня появились несколько плохих новостей.
          Читать дальше →
        • «Человек посередине», использующий отозванные сертификаты. Часть 2


            В нашей предыдущей статье были описаны основные механизмы проверки статуса сертификатов (проверки, является ли сертификат отозванным). В этой статье мы ответим на следующие вопросы:

            1. Как механизмы проверки статуса сертификатов реализованы в современных Веб-браузерах?
            2. Кто виноват? Почему они реализованы именно так?
            3. Что делать? Какие есть перспективы?

            Эта статья будет полезна тем, кому интересно разобраться в применяющихся на практике механизмах проверки статуса сертификатов.

            На Хабре уже писали на данную тему (например, тут и тут), мы же в этой статье решили привести ещё более подробное описание проверок, выполняемых современными браузерами, более актуальную информацию об их настройках, и, наконец, описание того, как можно исправить сложившуюся ситуацию в будущем.
            Читать дальше →
            • +13
            • 6,6k
            • 7
          Самое читаемое