0
0
Flaskframework~5 mins

Static file optimization in Flask

Choose your learning style9 modes available
Introduction

Static file optimization helps your website load faster by making files like images, CSS, and JavaScript smaller and quicker to send to users.

When your website has many images, styles, or scripts that slow down loading.
When you want to improve user experience by reducing wait times.
When you want to save bandwidth and reduce server load.
When preparing your Flask app for production deployment.
When you want to improve your website's ranking on search engines.
Syntax
Flask
from flask import Flask
from flask_compress import Compress

app = Flask(__name__)
Compress(app)

@app.route('/')
def home():
    return '<h1>Hello, optimized world!</h1>'
Use the flask_compress extension to automatically compress static files.
Make sure to install it first with pip install flask-compress.
Examples
This example shows how to enable compression for your Flask app to optimize static files.
Flask
from flask import Flask
from flask_compress import Compress

app = Flask(__name__)
Compress(app)
You can specify the compression algorithm like gzip for better control.
Flask
app = Flask(__name__)
app.config['COMPRESS_ALGORITHM'] = 'gzip'
Compress(app)
Adjust compression level (1-9) to balance speed and file size.
Flask
app = Flask(__name__)
app.config['COMPRESS_LEVEL'] = 6
Compress(app)
Sample Program

This Flask app serves static files like CSS and images with compression enabled by flask_compress. This makes files smaller and faster to load.

Flask
from flask import Flask, send_from_directory
from flask_compress import Compress
import os

app = Flask(__name__)
Compress(app)

@app.route('/')
def home():
    return '''
    <html lang="en">
    <head>
      <link rel="stylesheet" href="/static/style.css">
    </head>
    <body>
      <h1>Welcome to optimized Flask app!</h1>
      <img src="/static/image.png" alt="Sample Image">
    </body>
    </html>
    '''

@app.route('/static/<path:filename>')
def static_files(filename):
    return send_from_directory(os.path.join(app.root_path, 'static'), filename)

if __name__ == '__main__':
    app.run(debug=True)
OutputSuccess
Important Notes

Always test your site after enabling compression to ensure files load correctly.

Use browser DevTools Network tab to check if static files are compressed (look for Content-Encoding: gzip).

Combine compression with caching headers for best performance.

Summary

Static file optimization makes your website faster and lighter.

Use flask_compress to easily add compression in Flask.

Check your files with browser tools to confirm optimization.