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

PVS-Studio C#JavaC++Сегодня важный день – после 28 релизов шестой версии мы выпускаем PVS-Studio 7.00, где ключевым новшеством является поддержка языка Java. Однако за 2018 год накопилось много других важных изменений, касающихся С++, С#, инфраструктуры и поддержки стандартов кодирования. Поэтому предлагаем вашему вниманию заметку, которая обобщает основные изменения, произошедшие в PVS-Studio за последнее время.
Читать полностью »

PVS-Studio ROI

Время от времени нам задают вопрос, какую пользу в денежном эквиваленте получит компания от использования анализатора PVS-Studio. Я решил реализовать на сайте ROI-калькулятор и разместить подробное описание принципов его работы. Но прежде я решил вынести свои мысли и расчёты на обсуждение. Я надеюсь получить интересные и полезные комментарии, которые помогут сделать калькулятор как можно более достоверным и убедительным.

Вашему вниманию предлагается описание калькулятора, позволяющего рассчитать возврат инвестиций от использования в процессе разработки статического анализатора кода PVS-Studio.
Читать полностью »

Как PVS-Studio оказался внимательнее, чем три с половиной программиста

PVS-Studio, как и другие статические анализаторы кода, часто выдаёт ложные срабатывания. Но не стоит спешить считать странные срабатывания ложными. Это короткая история о том, как PVS-Studio вновь оказался внимательнее нескольких человек.

Нам в поддержку написал пользователь, утверждая, что анализатор выдаёт сразу четыре ложных срабатывания на одну строчку кода. Письмо, написанное в поддержку, изначально попало к Евгению Рыжкову, который, бегло прочитав его и не заметив аномального в фидбеке, сразу переслал его ведущему разработчику Святославу Размыслову. Евгений не всматривался в код, так что будет честно посчитать его только за половину программиста :).
Читать полностью »

Отладка утечек памяти в Chrome 66 стала гораздо удобней. DevTools теперь могут проводить трассировку, делать снапшоты DOM-объектов из C++, отображать все доступные DOM-объекты из JavaScript вместе со ссылками на них. Появляение этих возможностей стало следствием нового механизма трассировки C++ в сборщике мусора V8.

Напомню, что стабильный Chrome сейчас (20.03.2018) имеет версию 65, поэтому чтобы подивиться на фичу, придётся установить одну из нестабильных сборок (например, Beta имеет версию 66, а Dev и Canary — 67).

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

Ускорить доставку элементов фронтенда на устройство пользователя можно несколькими способами. Разработчик Артём Белов из самарского офиса норвежской компании Cxense попробовал самые многообещающие: HTTP/2, Server Push, Service Worker, а также оптимизацию в процессе сборки и на стороне клиента. Итак, что же нужно сделать, чтобы сократить время отклика приложения до минимума?

Выясняется, что алгоритмы сжатия существуют уже давно. Это произошло где-то в июне — видимо, где-то над Самарой пролетал метеорит и идея проверить новые алгоритмы сжатия, Zopfli и Brotli, пришла мне и парню из соседней компании. Больше чем уверен, вы читали его статью, это Александр Субботин. Статья разошлась на Medium, и он известен, а я нет.

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

image

Всем привет!

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

Буквально вчера выложил в открытый доступ первую рабочую версию консоли для отладки Canvas/WebGL приложений FConsole. Если вы всегда хотели редактировать свойства визуальных объектов без изменения исходного кода, а так же без сложностей просматривать всю иерархию визуальных объектов, то прошу под кат.

image

* На скриншоте представлена Flash-Console, которая бралась в качестве примера при разработке FConsole
Читать полностью »

Привет! В этот прекрасный пятничный день предлагаем вам ознакомиться с очередной частью цикла переводов советов для веб-разработчиков. Предыдущие части: 1-16, 17-32, 33-48.

Содержание:

   49   Циклическое переключение между панелями при помощи шорткатов
   50   Проверка и активация CSS media queries, а также нахождение этих правил в коде
   51   Предустановка разрешения нового устройства
   52   Улучшения полоски хлебных крошек в панели Elements
   53   Печать стектрейса в консоли
   54   Детектирование долгих фреймов (не путать с iframe)
   55   Продвинутая фильтрация запросов в панели «Network»
   56   Поиск по проекту с возможностью указания файла
   57   Новый экспериментальный редактор раскладки страницы
   58   Дублирование DOM-элементов
   59   Просмотр скриншотов поведения страницы
   60   Редактирование html-кода в панели «Console»
   61   Простые клавиатурные трюки для управления панелей «Стили»
   62   Выбор цвета, сгенерированного палитрой
   63   Инкремент и декремент чисел в DOM-атрибутах
   64   Сетевые запросы в панели «Timeline»
Читать полностью »

И вновь в эфире цикл переводов полезных советов для веб-разработчика. На этот раз автор расширил спектр исследуемых инструментов, добавив туда редактор Sublime Text и фреймворк Node.js. Предыдущие части: 1-16, 17-32.

Поехали!

Содержание:
   33.  Разворачивание упрощенной записи CSS-свойств
   34.  Определение совпадения селекторов по цвету
   35.  Использование визуальной навигации и просмотр снятых скриншотов процесса загрузки страницы
   36.  Sublime Text: нечеткий поиск при помощи функциональности GOTO
   37.  Быстрое изменение значения CSS-свойств при помощи клавиатуры и колеса мыши
   38.  Прокрутка элемента в области видимости
   39.  Node.js: Использование Babel для запуска ES6
   40.  Переход к просмотру и редактированию CSS или Javascript-файлов из панели «Elements»
   41.  Отображение значений Javascript-переменных рядом с кодом в процессе отладки
   42.  Использование цветовой группировки в панели «Network» для упрощения идентификации типа ресурса
   43.  Активация псевдо классов DOM-элемента
   44.  Инспектирование самих инструментов разработчика
   45.  Запуск выбранного блока кода из панели «Sources»
   46.  Установка условных точек останова
   47.  Переход к следующему вхождению выбранной строки при помощи горячих клавиш
   48.  Редактирование CSS-файла в панели «Sources» и упрощенное изменение значений CSS-свойств
Читать полностью »

Анализ рендеринга через Skia Debugger: как можно найти самые дорогие для отрисовки элементыДоброго дня, недавно я решал проблему притормаживания скролла на страницах Почты Mail.Ru. Особенно эта проблема была заметна на retina-дисплеях. После простого анализа я пришел к выводу, что одна из основных проблем — это медленная отрисовка страницы.

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

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

Анализ рендеринга через Skia Debugger: как можно найти самые дорогие для отрисовки элементы
Читать полностью »


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