debjyotikar001/asset-optimise

一个用于通过压缩HTML、CSS和JavaScript来优化前端资源的Laravel包,提高页面加载速度并节省带宽。

V2.2.0 2024-09-25 15:49 UTC

This package is auto-updated.

Last update: 2024-09-25 15:56:38 UTC


README

Asset Optimise是一个强大且轻量级的Laravel包,旨在通过优化前端资源来提升您的Web应用性能。此包会自动压缩HTML、CSS和JavaScript代码,以减小文件大小、提高页面加载速度并节省带宽。

关键特性

  1. 压缩HTML、CSS和JavaScript以实现更快的加载。 了解更多...
  2. 可配置以跳过内联CSS、内联JavaScript和HTML注释的压缩。 了解更多...
  3. 支持使用自定义HTML注释排除特定代码部分不被压缩。 了解更多...
  4. 支持排除特定路由URL路径不被压缩。 了解更多...
  5. 可配置以跳过特定应用环境的压缩。 了解更多...
  6. 易于与Laravel的中间件系统集成。 了解更多...
  7. 支持电子邮件(HTML、CSS和JavaScript)压缩。 了解更多...
  8. 支持多个资源(CSS或JavaScript)合并和压缩。 了解更多...
  9. 支持资源(CSS或JavaScript)压缩。 了解更多...
  10. 可扩展以支持未来的更新,包括图像压缩和CDN集成。

安装

Asset Optimise for Laravel需要PHP 8.0或更高版本。这个版本支持Laravel 9.x、10.x和11.x。

要获取最新版本,只需使用Composer引入项目。

composer require debjyotikar001/asset-optimise

配置

Asset Optimise for Laravel支持可选配置。要开始,您需要发布所有供应商资源

php artisan vendor:publish --provider="Debjyotikar001\AssetOptimise\AssetOptimiseServiceProvider"

这将在您的应用中创建一个config/assetoptimise.php文件,您可以根据需要修改它来设置配置。同时,请确保检查此包中原始配置文件的更改。

注册中间件

为了在Laravel中添加资源优化功能,您需要添加Minifier中间件。

(Laravel 10或更早版本)

app/Http/Kernel.php文件中

protected $middleware = [
  // other middleware
  \Debjyotikar001\AssetOptimise\Middleware\Minifier::class,
];

protected $middleware = [
  // other middleware
  'assetOptimise',
];

您可以使用中间件类或中间件别名assetOptimise在web中间件或路由中使用。

(Laravel 11或更高版本)

bootstrap/app.php文件中

->withMiddleware(function (Middleware $middleware) {
  $middleware->web(append: [
    // other middleware
    \Debjyotikar001\AssetOptimise\Middleware\Minifier::class,
  ]);
})

->withMiddleware(function (Middleware $middleware) {
  $middleware->web(append: [
    // other middleware
    'assetOptimise',
  ]);
})

您可以使用中间件类或中间件别名assetOptimise在web中间件或路由中使用。

用法

这是如何在项目中使用AssetOptimise for Laravel的方法。

启用

您必须在config/assetoptimise.php文件中将enabled设置为true来启用资源优化功能。例如

'enabled' => env('ASSETOPTIMISE_ENABLED', true),

允许的环境

如果您希望在特定环境中禁用它,例如在本地开发或测试期间以简化调试,则可以在config/assetoptimise.php文件中将环境值设置为以逗号(,)分隔的字符串,默认值为local,production,staging。例如:

'allowed_envs' => env('ASSETOPTIMISE_ALLOWED_ENVS', 'local,production,staging'),

跳过特定代码部分

如果您想使用HTML注释<!-- no-optimise --> ... <!-- /no-optimise -->跳过特定代码部分不被压缩,这些部分支持HTML、CSS和JavaScript代码。例如:

<!-- no-optimise -->
<style>
  /* Don't optimise this CSS code */
  h1 {
    color: black;
    font-size: 40px;
  }

  p {
    color: red;
    font-size: 24px;
  }
</style>

<h1>Asset Optimise</h1>
<p>Don't optimise this HTML code</p>

<script>
  // Don't optimise this JavaScript code
  alert("Asset Optimise: Don't optimise this JavaScript code");
</script>
<!-- /no-optimise -->

跳过内联CSS

如果您想跳过HTML中<style>标签内的内联CSS优化,请在config/assetoptimise.php文件中将skip_css设置为true,默认值为false。例如:

'skip_css' => env('ASSETOPTIMISE_SKIP_CSS', true),

跳过内联JavaScript

如果您想跳过HTML中<script>标签内的内联JavaScript优化,请在config/assetoptimise.php文件中将skip_js设置为true,默认值为false。例如:

'skip_js' => env('ASSETOPTIMISE_SKIP_JS', true),

跳过HTML注释

如果您想跳过输出中的所有HTML注释,请在config/assetoptimise.php文件中将skip_comment设置为true,默认值为false。例如:

'skip_comment' => env('ASSETOPTIMISE_SKIP_COMMENT', true),

跳过或忽略特定路由URL

如果您想跳过或忽略特定路由URL,您必须在config/assetoptimise.php文件中设置路径。您可以使用星号(*)作为通配符。例如:

'skip_urls' => [
    '/',
    'about',
    'user/*',
    '*_dashboard',
    '*/download/*',
  ],

示例URL

  • /:排除主页URL的压缩。
  • about:此确切URL将排除在压缩之外。
  • user/*:以user/开头的任何URL(如user/profileuser/settings)将排除。
  • *_dashboard:以_dashboard结尾的任何URL(如admin_dashboarduser_dashboard)将排除。
  • */download/*:包含download(如pdf/download/001image/download/debjyotikar001)的任何URL将排除。

启用电子邮件优化

您必须在config/assetoptimise.php文件中将email_enabled设置为true,以启用电子邮件的资产优化功能。例如:

'email_enabled' => env('ASSETOPTIMISE_EMAIL_ENABLED', true),

合并和压缩多个资产(CSS或JavaScript)

您可以使用mergeAssets()辅助函数,允许您合并和压缩多个CSS或JavaScript文件。此函数将处理publicresources目录,将最终输出文件存储在您的存储文件夹中以供优化使用。这减少了HTTP请求数量,并加快了资产加载速度。

工作原理

mergeAssets()辅助函数接受四个参数

  • 文件路径数组:您想要合并和压缩的CSS或JavaScript文件的数组。路径可以是来自publicresources目录的。
  • 输出文件名:将生成并存储的最终输出文件(不带扩展名)的名称。
  • 文件类型:指定合并的文件类型,可以是cssjs
  • 缓存时间(可选):合并文件刷新的时间(以分钟为单位)。默认为1440分钟(24小时或1天)。

示例(CSS)

<link rel="stylesheet" href="{{ mergeAssets(
  [
    'assets/css/custom.css',
    'core.css',
  ],
  'merged-css',
  'css',
  60
) }}"/>

文件路径可以是来自publicresources/css目录的。它返回merged-css.min.css文件URL。

示例(JS)

<script src="{{ mergeAssets(
  [
    'assets/js/custom.js',
    'core.js',
  ],
  'merged-js',
  'js'
) }}"></script>

文件路径可以是来自publicresources/js目录的。它返回merged-js.min.js文件URL。

压缩资产(CSS或JavaScript)

您可以使用minifyAsset()辅助函数,允许您压缩CSS或JavaScript文件。此函数将处理publicresources目录,将最终输出文件存储在您的存储文件夹中以供优化使用。这有助于您减少文件大小,提高页面加载速度并节省带宽。

工作原理

辅助函数 minifyAsset() 接受四个参数

  • 文件路径:您想压缩的CSS或JavaScript文件的路径。路径可以来自 publicresources 目录。
  • 文件类型:可以是 cssjs,指定要压缩的文件类型。
  • 缓存时间(可选):在压缩文件刷新后的时间(以分钟为单位)。默认为 1440 分钟(24小时或1天)。
  • 输出文件名(可选):最终生成的存储的输出文件名(不包含扩展名)。默认为给定文件名。

示例(CSS)

<link rel="stylesheet" href="{{ minifyAsset('app.css', 'css', 120, 'app-minify') }}"/>

文件路径可以来自 publicresources/css 目录。它返回 app-minify.min.css 文件URL。

示例(JS)

<script src="{{ minifyAsset('assets/js/custom.js', 'js') }}"></script>

文件路径可以来自 publicresources/js 目录。它返回 custom.min.js 文件URL。

更新日志

请参阅更新日志获取有关最近更改的更多信息。

贡献

欢迎贡献!请参阅贡献指南了解如何开始。

许可证

Asset Optimise 使用MIT许可证

致谢

此包使用hexydec/htmldoc库进行HTML、CSS和JavaScript压缩。

支持

如果您对此包有任何一般性问题,请随时通过debjyotikar001@gmail.com联系我们。