facile-it/zf-link-headers-module

此包已被废弃,不再维护。作者建议使用 facile-it/laminas-link-headers-module 包。

用于通过 HeadLink 视图助手添加资源器的 Zend Framework 模块来推送 Link 头部

0.2.1 2017-12-07 19:39 UTC

This package is auto-updated.

Last update: 2020-01-23 17:23:46 UTC


README

Travis Scrutinizer Coverage Scrutinizer GitHub release

此模块将自动发送支持 资源提示预加载Link HTTP 头部,通过 HTTP 头部发送。

当前支持的提示

来自 OptionsInterface

const MODE_PRELOAD = 'preload';
const MODE_PREFETCH = 'prefetch';
const MODE_DNS_PREFETCH = 'dns-prefetch';
const MODE_PRECONNECT = 'preconnect';
const MODE_PRERENDER = 'prerender';

配置

这是默认配置,您可以在自己的配置中覆盖这些选项。

return [
    'facile' => [
        'zf_link_headers_module' => [
            'stylesheet_enabled' => false, // send link headers for stylesheet links
            'stylesheet_mode' => 'preload', // resource hint for stylesheet links
            'script_enabled' => false, // send link headers for scripts
            'script_mode' => 'preload', // resource hint for script links
            'http2_push_enabled' => true, // if disabled, a "nopush" attributed will be added to disable HTTP/2 push 
        ],
    ],
];

示例

配置

默认配置

return [
    'facile' => [
        'zf_link_headers_module' => [
            'stylesheet_enabled' => false, // send link headers for stylesheet links
            'stylesheet_mode' => 'preload', // resource hint for stylesheet links
            'script_enabled' => false, // send link headers for scripts
            'script_mode' => 'preload', // resource hint for script links
            'http2_push_enabled' => true, // if disabled, a "nopush" attributed will be added to disable HTTP/2 push 
        ],
    ],
];

模板

在您的模板中

<!DOCTYPE html>
<html lang="it">
    <head>
        <?= 
        $this->headLink(['rel' => 'preload', 'as' => 'image',  'href' => $this->basePath() . $this->asset('assets/images/logo.png'), 'media' => 'image/png')
             ->headLink(['rel' => 'preload', 'as' => 'style',  'href' => $this->basePath() . $this->asset('assets/vendor.css')])
             ->headLink(['rel' => 'preload', 'as' => 'script', 'href' => $this->basePath() . $this->asset('assets/vendor.js')])
             // prefetch (low priority) resources required in th next pages
             ->headLink(['rel' => 'prefetch', 'as' => 'style', 'href' => $this->basePath() . $this->asset('assets/next.css')])
             // do not send preload headers
             ->prependStylesheet($this->basePath() . $this->asset('assets/vendor.css'))
             ->prependStylesheet($this->basePath() . $this->asset('assets/vendor.js'))
        ?>
        <?=
        $this->headScript()
            ->prependFile('/script/foo.js')
        ?>
    </head>
    <body>
        <!-- your content here -->
   
        <script type="text/javascript" src="<?= $this->basePath() . $this->asset('assets/vendor.js') ?>"></script>
    </body>
</html>

响应头部

模块将自动将 Link 头部添加到响应中

Link: </assets/images/logo.png>; rel="preload"; as="image"; media="image/png",
  </assets/vendor.css>; rel="preload"; as="style",
  </assets/vendor.js>; rel="preload"; as="script",
  </assets/next.css>; rel="prefetch"; as="style"

请注意,资源 /script/foo.js 不在头部,因为它没有被包含在预加载头部链接中。

自动发送样式表预加载

在您的配置中启用 stylesheet_enabled 模式,您可以避免为所有样式插入预加载链接。

配置

return [
    'facile' => [
        'zf_link_headers_module' => [
            'stylesheet_enabled' => true, // send link headers for stylesheet links 
        ],
    ],
];

您可以可选地更改 stylesheet_mode(支持的模式作为 OptionsInterface 中的常量可用)来用于样式表。

模板

在您的模板中

<!DOCTYPE html>
<html lang="it">
    <head>
        <?= 
        $this->prependStylesheet($this->basePath() . $this->asset('assets/vendor.css'))
        ?>
    </head>
    <body>
        <!-- your content here -->
    </body>
</html>

响应头部

模块将自动将 Link 头部添加到响应中

Link: </assets/vendor.css>; rel="preload"; as="style"; type="text/css"; media="screen"

自动发送脚本预加载

在您的配置中启用 script_enabled 模式,您可以避免为所有脚本插入预加载链接。

配置

return [
    'facile' => [
        'zf_link_headers_module' => [
            'script_enabled' => true, // send link headers for script links 
        ],
    ],
];

您可以可选地更改 script_mode(支持的模式作为 OptionsInterface 中的常量可用)来用于脚本。

模板

在您的模板中

<!DOCTYPE html>
<html lang="it">
    <head>
        <?=
        $this->headScript()
            ->prependFile('/script/foo.js')
            ->prependFile('/script/bar.js', 'text/foo')
        ?>
    </head>
    <body>
        <!-- your content here -->
    </body>
</html>

响应头部

模块将自动将 Link 头部添加到响应中

Link: </script/foo.js>; rel="preload"; as="script"; type="text/javascript",
  </script/bar.js>; rel="preload"; as="script"; type="text/foo"

禁用 HTTP/2 推送

使用HTTP/2,发送预加载链接头,当页面被请求时,服务器会将内容推送到浏览器。

这并不总是必要的,因为浏览器可以缓存内容,推送内容可能会增加带宽使用,但不会显著提高性能。

您可以通过将配置选项http2_push_enabled设置为false来禁用推送设置。这将添加一个nopush属性,指示支持HTTP/2推送的服务器不要推送资源(例如,源可能有附加信息表明它可能已经在缓存中)。