static stylesheets gets reloaded with each post request

Question

Every time there is a post from page the entire bunch of css gets reloaded. Is it possible to tell them not to come in again and again. There is a series of GET that get fired. Can we optimize in some way or is it normal behavior?

The environment is google apps in python.

Answer 1

Check out Using Static Files and Handlers for Static Files. Since the latter link refer to cache duration of static files, I believe the the caching functionality is possible.

Unlike a traditional web hosting environment, Google App Engine does not serve files directly out of your application's source directory unless configured to do so. We named our template file index.html, but this does not automatically make the file available at the URL /index.html.

But there are many cases where you want to serve static files directly to the web browser. Images, CSS stylesheets, JavaScript code, movies and Flash animations are all typically stored with a web application and served directly to the browser. You can tell App Engine to serve specific files directly without your having to code your own handler.

Answer 2

You just have to put all your css in a "static directory" and specify an expiration into the app.yaml file.

Here is the app.yaml of one of my project:

application: <my_app_id>
version: 1
runtime: python
api_version: 1
skip_files: |
    ^(.*/)?(
    (app\.yaml)|
    (index\.yaml)|
    (\..*)|
    (.*\.pyc)|
    (.*\.bat)|
    (.*\.svn/.*)|
    (.*\.lnk)|
    (datastore/.*)|
    (img/src_img/.*)|
    )$

handlers:  
- url: /favicon\.ico
  static_files: img/favicon.ico
  upload: img/favicon.ico
  expiration: 180d

- url: /img
  static_dir: img
  expiration: 180d

- url: /static-js
  static_dir: static-js
  expiration: 180d

- url: .*
  script: main.py

Answer 3

If your CSS comes from a static file, then as Steve mentioned you want to put it in a static directory and specify it in your app.yaml file. For example, if your CSS files are in a directory called stylesheets:

handlers:
- url: /stylesheets
  static_dir: stylesheets
  expiration: "180d"

The critical thing to remember with this is that when you upload a new version of your CSS file, you must change the filename because otherwise, visitors to your site will still be using the old cached version instead of your shiny new one. Simply incrementing a number on the end works well.

If your CSS is dynamically generated, then when the request comes in you want to set the caching in the response object's headers. For example, in your request handler you might have something like this:

class GetCSS(webapp.RequestHandler):
  def get(self):
    # generate the CSS file here, minify it or whatever
    # make the CSS cached for 86400s = 1 day
    self.response.headers['Cache-Control'] = 'max-age=86400' 
    self.response.out.write(your_css)