预编译类名称缩短的django静态文件。
django-static-class-minifier的Python项目详细描述
django静态类小型化器
说明
类minifier包将dom中的类名缩短为单个字符,并减小文件大小。在即将发布的博客文章中详细介绍了该算法。
最终结果:
安装
$ pip install django-static-class-minifier
(您可能需要在requirements.txt中编写此文件)
在settings.py-
在已安装的应用程序中-
INSTALLED_APPS = [
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles',
'static_compressor', #installed app
'.....'
]
在中间件中-
MIDDLEWARE = [
'django.middleware.security.SecurityMiddleware',
'django.contrib.sessions.middleware.SessionMiddleware',
'django.middleware.common.CommonMiddleware',
'django.middleware.csrf.CsrfViewMiddleware',
'static_compressor.middleware.MinifyClassMiddleware', # Add this line, right after csrf middleware.
'django.contrib.auth.middleware.AuthenticationMiddleware',
请确保已设置静态文件和静态根目录的路径。
STATICFILES_DIRS = (
os.path.join(BASE_DIR, 'static'),
)
STATIC_ROOT = os.path.join(BASE_DIR, 'all_staticfiles')
更新静态文件存储:
STATICFILES_STORAGE = 'static_compressor.staticfiles_storage.CompressedStaticFilesStorage'
运行以下命令,并确保在运行该命令之前删除静态根文件夹。
$ python manage.py collectstatic_compress
当您运行$ python manage.py collectstatic_compress
时,它将有一个额外的后处理过程来压缩静态文件,并创建data.json文件,其中包含来自所有包含的css文件和js文件的类。
js文件考虑和更改的类选择器-
querySelector('.flex-box');
querySelectorAll('.flex-boxes');
classList.contains('active');
classList.add('active);
classList.remove('active');
classList.toggle('active');
如果基于http响应或将类附加到dom的公共函数向dom添加类,则考虑排除这些文件。现在这就是这个项目的局限性。将来,可能会有一种语法来考虑这些类。
确保您的Web服务器配置为提供预压缩的静态文件:
- 如果使用nginx:
- 设置ngx_http_gzip_static_module以提供gzip(.gz)预压缩文件。
- 树外模块ngx_brotli是为brotli(.br)预压缩文件提供服务所必需的。
- Caddy将服务于.gz和.br,无需额外配置。
另外,由于brotli不受所有浏览器的支持,您应该确保反向代理/cdn支持vary头,并且您的web服务器将其设置为^{
可用存储空间
static_compress.CompressedStaticFilesStorage
:从静态文件生成.br
和.gz
static_compress.CompressedManifestStaticFilesStorage
:类似于^{} ,但也为哈希文件生成压缩文件static_compress.CompressedCachedStaticFilesStorage
:类似于^{} ,但也为哈希文件生成压缩文件 您还可以通过将static_compressor.staticfiles_storage.CompressMixin
应用于类来向自己的后端添加支持。 默认情况下,它只压缩以.js
、.css
和.svg
结尾的文件。这由下面的设置控制。
设置
django静态类minifier设置及其默认值:
EXCLUDE_STATIC_JS_FILES = [] # exclude js libraries from classnames minifier
EXCLUDE_STATIC_CSS_FILES = []
EXCLUDE_STATIC_SVG_FILES = []
EXCLUDE_STATIC_DIRECTORY = []
EXCLUDE_URL_MINIFICATION = []
EXCLUDED_CLASSNAMES_FROM_MINIFYING = []
MINIFY_CLASS_HTML = False # Change it to True in production environment
# By default, the admin files classes won't be minified.
STATIC_CLASSES_FILE_NAME = 'data.json' # It should be an json file
CLASS_SALT_VALUE = 'ascii_lowercase' # Choices - 'ascii_lowercase' or 'ascii_uppercase' or 'ascii_letters' or custom characters. The custom characters should not contain special characters and the length of salt should be greater then 8. Example : CLASS_SALT_VALUE = '_abcdefghijk123'.
# Incase, Inside your app if there is static directory then include it in STATIC_INCLUDE_DIRS
STATIC_INCLUDE_DIRS = (
os.path.join(BASE_DIR, 'faq/static'), # Example : Let the app name be faq
)
STATIC_COMPRESS_FILE_EXTS = ['js', 'css', 'svg']
STATIC_COMPRESS_METHODS = ['gz', 'br']
STATIC_COMPRESS_KEEP_ORIGINAL = True
STATIC_COMPRESS_MIN_SIZE_KB = 30
默认值类型和说明-
Settings | Type | Description |
---|---|---|
EXCLUDE_STATIC_JS_FILES | Array | These js files will be excluded from classnames shortening, In other words the class names won't be changed. |
EXCLUDE_STATIC_CSS_FILES | Array | Same as above but for css files. |
EXCLUDE_STATIC_SVG_FILES | Array | Same as above but for svg files |
EXCLUDE_STATIC_DIRECTORY | Array | The directory name in the array will be excluded from class names shortening. |
EXCLUDE_URL_MINIFICATION | Array | The URL in the array will exclude from shortening of class names. |
EXCLUDED_CLASSNAMES_FROM_MINIFYING | Array | The words in an array won't be shortened. |
MINIFY_CLASS_HTML | Boolean | If its True it minifies class names in the HTML. Make sure there is JSON file or it will throws an error. |
STATIC_CLASSES_FILE_NAME | String | The JSON file name. By default its data.json |
STATIC_INCLUDE_DIRS | Tuple | Includes static directory inside the app. |
CLASS_SALT_VALUE | String | Choices - 'ascii_lowercase' or 'ascii_uppercase' or 'ascii_letters' or custom characters. The custom characters should not contain special characters and the length of salt should be greater then 8. Example : CLASS_SALT_VALUE = '_abcdefghijk123'. |
资源
在这种情况下,如果您想在html中内部样式或内部加载脚本。然后考虑使用Django Inline Static包。
文件大小缩减
Original file - 100k style.css
compressed class minifier file - 70k style.css (30% reduction in file size)
(Note - reduction of the file depends on the number of class selectors used and the length of the class name.)
After brotli and Gzip compression - 40k style.css.gz (60% reduction in file size, in total), 35k style.css.br (65% reduction in file size)
学分
我已经将代码与django静态压缩包合并,以启用gzip和brotli压缩。 如果您只使用brotli和gzip压缩而不使用类minifier,则会出现这种情况。你可以使用django-static-compress django静态压缩的作者Manatsawin Hanmongkolchai
许可证
授权编码愉快!:)