facile-it / zf-link-headers-module
用于通过 HeadLink 视图助手添加资源器的 Zend Framework 模块来推送 Link 头部
Requires
- php: ^7.0
- container-interop/container-interop: ^1.2
- psr/container: ^1.0
- zendframework/zend-eventmanager: ^3.0
- zendframework/zend-http: ^2.5.4
- zendframework/zend-modulemanager: ^2.7.1
- zendframework/zend-mvc: ^3.0
- zendframework/zend-servicemanager: ^3.0.3
- zendframework/zend-stdlib: ^3.1
- zendframework/zend-view: ^2.6.7
Requires (Dev)
- facile-it/facile-coding-standard: ^0.1.0
- phpunit/phpunit: ^6.0
- zendframework/zend-config: ^2.6.0 || ^3.0
- zendframework/zend-test: ^3.1
This package is auto-updated.
Last update: 2020-01-23 17:23:46 UTC
README
此模块将自动发送支持 资源提示 和 预加载 的 Link
HTTP 头部,通过 HTTP 头部发送。
当前支持的提示
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推送的服务器不要推送资源(例如,源可能有附加信息表明它可能已经在缓存中)。