深圳做网站：使用服务器时序测量性能

2019.08.13 mf_web

148

在进行任何类型的性能优化工作时，我们学到的第一件事就是在您提高性能之前必须先测量它。如果不能测量某些东西工作的速度，我们无法判断所做的改变是改善性能，没有效果，甚至是使事情变得更糟。

我们中的许多人都熟悉在某种程度上处理性能问题。这可能就像试图弄清楚为什么页面上的JavaScript没有尽快开始，或者为什么图像花费太长时间出现在糟糕的酒店无线网络上一样简单。这些问题的答案经常出现在一个非常熟悉的地方：浏览器的开发者工具。

深圳做网站多年来，开发人员工具已得到改进，可帮助我们解决应用程序前端的各种性能问题。浏览器现在甚至内置了性能审计。这可以帮助追踪前端问题，但这些审计可能会显示我们无法在浏览器中修复的另一个缓慢的来源。该问题是服务器响应时间较慢。

“第一个字节的时间”

很少有浏览器优化可以改善在服务器上构建缓慢的页面。该成本是在发出文件请求的浏览器和接收响应之间产生的。在开发人员工具中研究您的网络瀑布图将在“等待（TTFB）”类别下显示此延迟。这是浏览器在发出请求和接收响应之间等待的时间。

在性能方面，这被称为时间到第一个字节 - 服务器开始发送浏览器可以开始使用的内容之前所花费的时间。在等待时间中包含服务器构建页面所需的一切。对于典型站点，可能涉及将请求路由到应用程序的正确部分，对请求进行身份验证，对数据库等后端系统进行多次调用。它可能涉及通过模板系统运行内容，使API调用第三方服务，甚至可能发送电子邮件或调整图像大小。服务器完成请求所做的任何工作都会被压缩到用户在浏览器中遇到的TTFB等待状态。

Chrome DevTools中的“网络”面板显示单个页面请求的检查 — 检查文档请求显示浏览器等待服务器响应的时间。

那么我们如何缩短时间并开始更快地向用户提供页面？嗯，这是个大问题，答案取决于你的申请。这是性能优化本身的工作。我们首先需要做的是衡量绩效，以便判断任何变化的好处。

服务器计时标头

Server Timing的工作不是帮助您实际在服务器上进行活动。您需要使用后端平台提供给您的任何工具集来自行完成计时。相反，服务器计时的目的是指定如何将这些测量结果传达给浏览器。

这样做的方式非常简单，对用户透明，对页面重量的影响最小。信息作为一组简单的HTTP响应头发送。

Server-Timing: db;dur=123, tmpl;dur=56

此示例传达两个名为db和的不同时间点tmpl。这些不是规范的一部分 - 这些是我们选择的名称，在这种情况下分别代表一些数据库和模板时序。

该dur属性表明操作完成所需的毫秒数。如果我们在Developer Tools的Network部分查看请求，我们可以看到时序已添加到图表中。

Chrome DevTools中页面请求的Timings面板显示了一个新的Server Timing部分。 — 将出现一个新的服务器计时部分，显示使用Server-Timing HTTP标头设置的计时。

该Server-Timing首标可以采取由逗号分隔的多个指标：

Server-Timing: metric, metric, metric

每个指标都可以指定三种可能的属性

短名称的指标（如db我们的例子）
甲持续时间以毫秒（表示为dur=123）
甲描述（表示为desc="My Description"）

每个属性用分号作为分隔符分隔。我们可以像这样添加对我们示例的描述：

Server-Timing: db;dur=123;desc="Database", tmpl;dur=56;desc="Template processing"

Chrome DevTools中页面请求的Timings面板显示了用于Server Timing指标的描述。 — 提供时，名称将替换为描述。

唯一需要的属性是name。两个dur和desc是可选的，并在必要时可任选地使用。例如，如果您需要调试在一个服务器或数据中心而不是另一个服务器或数据中心上发生的计时问题，那么将该信息添加到响应中而没有相关的时间可能会很有用。

Server-Timing: datacenter;desc="East coast data center", db;dur=123;desc="Database", tmpl;dur=56;desc="Template processing”

然后这将与时间一起显示出来。

Chrome DevTools中页面请求的Timings面板显示没有设置时间的服务器计时。 — 显示“东海岸数据中心”值，即使它没有时间。

您可能注意到的一件事是时间条不会以瀑布模式显示。这只是因为服务器计时不会尝试传递时序序列，只是原始指标本身。

实现服务器时序

您自己的应用程序中的确切实现将取决于您的具体情况，但原则是相同的。步骤始终是：

一些操作时间
收集时间结果
输出HTTP标头

在伪代码中，响应的生成可能如下所示：

startTimer('db')getInfoFromDatabase()  stopTimer('db')startTimer('geo')geolocatePostalAddressWithAPI('10 Downing Street, London, UK')endTimer('geo')outputHeader('Server-Timing', getTimerOutput())

在这些方面实现某些东西的基础知识在任何语言中都应该是直截了当的。一个非常简单的PHP实现可以使用该microtime()函数进行计时操作，并且可能看起来像下面的内容。

class Timers{
    private $timers = [];
    public function startTimer($name, $description = null)
    {
        $this->timers[$name] = [
            'start' => microtime(true),
            'desc' => $description,
        ];
    }
    public function endTimer($name)
    {
        $this->timers[$name]['end'] = microtime(true);
    }
    public function getTimers()
    {
        $metrics = [];
        if (count($this->timers)) {
            foreach($this->timers as $name => $timer) {
                $timeTaken = ($timer['end'] - $timer['start']) * 1000;
                $output = sprintf('%s;dur=%f', $name, $timeTaken);
                if ($timer['desc'] != null) {
                    $output .= sprintf(';desc="%s"', addslashes($timer['desc']));
                } 
                $metrics[] = $output;
            }
        }
        return implode($metrics, ', ');
    }}

测试脚本将使用它，如下所示，这里使用该usleep()函数人为地创建脚本运行的延迟，以模拟需要时间来完成的过程。

$Timers = new Timers();$Timers->startTimer('db');usleep('200000');$Timers->endTimer('db');$Timers->startTimer('tpl', 'Templating');usleep('300000');$Timers->endTimer('tpl');$Timers->startTimer('geo', 'Geocoding');usleep('400000');$Timers->endTimer('geo');header('Server-Timing: '.$Timers->getTimers());

运行此代码生成了一个如下所示的标头：

Server-Timing: db;dur=201.098919, tpl;dur=301.271915;desc="Templating", geo;dur=404.520988;desc="Geocoding"

Chrome DevTools中页面请求的Timings面板显示正确显示的测试值。 — 示例中设置的服务器计时显示在“计时”面板中，并在我们的测试脚本中配置了延迟。

现有实施

考虑到Server Timing的方便性，我找到的实现相对较少。该服务器定时NPM包提供了使用服务器定时从节点项目的便捷方式。

如果你使用基于中间件的PHP框架tuupola / server-timing-middleware也提供了一个方便的选项。我已经在Notist的生产中使用了几个月，如果你想在野外看到一个例子，我总是留下一些基本的时间。

对于浏览器支持，我见过的最好的是Chrome DevTools，这就是我在本文中用于屏幕截图的内容。

注意事项

服务器定时本身为通过线路发回的HTTP响应增加了非常小的开销。标头非常小，通常可以安全发送而不必担心只针对内部用户。即便如此，保持名称和描述的简短也是值得的，这样您就不会增加不必要的开销。

更令人担忧的是您可能在服务器上为页面或应用程序计时的额外工作。添加额外的时间和日志记录本身可以对性能产生影响，因此值得实现一种在需要时打开和关闭它的方法。

深圳做网站使用服务器计时标头是确保应用程序的前端和后端的所有计时信息都可在一个位置访问的好方法。如果您的应用程序不是太复杂，它可以很容易实现，您可以在很短的时间内启动并运行。