Как я могу контролировать время рендеринга в браузере?

Если в браузере включен JavaScript, вы можете написать встроенный скрипт и отправить его первым делом в своем HTML. Скрипт будет делать две вещи:

1. Запишите текущее системное время в JS-переменную (если повезет, время может примерно соответствовать времени начала отрисовки страницы).
2. Прикрепите JS-функцию к событию onLoad страницы. Затем эта функция снова запросит текущее системное время, вычтет время начала из шага 1 и отправит его на сервер вместе с местоположением страницы (или каким-либо уникальным идентификатором, который вы можете динамически вставить во встроенный скрипт на вашем сервере).

<script language="JavaScript">
var renderStart = new Date().getTime();
window.onload=function() { 
   var elapsed = new Date().getTime()-renderStart;
   // send the info to the server 
   alert('Rendered in ' + elapsed + 'ms'); 
} 

</script>

... usual HTML starts here ...

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

Navigation Timing API доступен в современных браузерах (IE9+), кроме Safari:

function onLoad() { 
  var now = new Date().getTime();
  var page_load_time = now - performance.timing.navigationStart;
  console.log("User-perceived page loading time: " + page_load_time);
}

Что касается неинвазивных методов, то Hammerhead измеряет полное время загрузки (включая выполнение JavaScript), хотя и в Только фаерфокс.

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

Взгляните на Selenium — они предлагают удаленное управление, которое может автоматически запускать разные браузеры (например, IE6), загружать страницы, тест для определенного контента на странице. В конце генерируются отчеты, которые также показывают время рендеринга.

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

Что касается IE, вы можете подумать о написании плагина. Похоже, что на рынке мало таких инструментов. Может быть, вы могли бы продать его.

В Firefox вы можете использовать Firebug для контроля времени загрузки. С помощью плагина YSlow вы даже можете получить рекомендации по улучшению производительности.