Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

App Engine taking Far Longer (> 1 sec) to serve static JS than static CSS

(Question edited b/c I have realized it involves file type)

This file is 20kb. It is consistently taking > 1 second to serve.

http://www.adrenalinemobility.com/js/ss-symbolicons.js

Here is the same file with .css as it's extension:

http://www.adrenalinemobility.com/js/ss-symbolicons.css

It serves almost 1 whole second faster.

Here is my app.yaml:

application: adrenaline-website
version: 1
api_version: 1
runtime: python27
threadsafe: true

libraries:
- name: jinja2
  version: latest

handlers:
- url: /favicon\.ico
  static_files: assets/favicon.ico
  upload: assets/favicon\.ico

- url: /css
  static_dir: assets/css

- url: /img
  static_dir: assets/img

- url: /js
  static_dir: assets/js

- url: /.*
  script: web.APP

I've also tried this static_files line (before the /js handler), and it was slow too:

- url: /js/ss-symbolicons.js
  static_files: assets/js/ss-symbolicons.js
  upload: assets/js/ss-symbolicons.js

Ways I have observed this:

  • Chrome, Firefox (both on Linux) - from a DSL connection in Silicon Valley
  • wget, curl, etc from that machine.
  • Remotely wget and curl from a high-speed server at the University of Illinois
  • Remote web testing services like webpagetest (see below):

Here's a webpagetest waterfall graph that illustrates this problem - notice the one file has a huge TTFB: http://www.webpagetest.org/result/131101_ZQ_ZGQ/1/details/

If i manually set the mime_type to text, then it goes fast. application/javascript, application/x-javascript, text/javascript are all slow. Currently those files are serving without manually specified mime-type if you wish to test.

Some more info, as noticed by jchu:

The slow version serves with: Content-Length: 19973 and the fast version serves with: Transfer-Encoding: chunked

Still more details:

I usually get server 74.125.28.121. Someone on reddit got server 173.194.71.121 and it seems to have even serving speeds between them. So maybe it's server/location dependent?

Another post about this issue

Here is a pastebin with full curl logs of requests for both files

Here is another pastebin with just the timing information from ten requests on each file in a tight loop

like image 882
Murph Avatar asked Nov 01 '13 17:11

Murph


People also ask

How to serve static content?

To serve static files such as images, CSS files, and JavaScript files, use the express.static built-in middleware function in Express. The root argument specifies the root directory from which to serve static assets. For more information on the options argument, see express.static.

What is static content in app?

Static content is anything that will not be executed as JSPs or Servlets. The following example is a basic HTML page that shows a welcome message. <! DOCTYPE html>

What is static repository?

Statically is a content delivery network (CDN) that can serve files directly from GitHub, GitLab, or Bitbucket. You don't need to create any account to use Statically, and the service is free — though you can donate to sponsor them — which makes it straightforward to use.


2 Answers

Add mime_type: text to your JavaScript static resource.

Would need to look into what mime_type is being assumed, what what clever trick is being done for text vs other mime types...

like image 70
bwawok Avatar answered Sep 21 '22 00:09

bwawok


I've been seeinig the same behavior.

GAE has some strange edge caching behavior for these javascript files. After the 4th or fifth consecutive request, the response time improves significantly (some type of edge caching of the gzipped content kicks in). In my experiments it's gone from around 1.2s -> 190ms

I've been able to reproduce this consistently across 3 GAE apps. If you use Chrome, you can go to the DevTools settings and disable cache (while DevTools is open). Reloading the page a few times will get your javascript transfer times down to the reasonable numbers.

Google's edge cache probably has some logic where it determines it won't bother caching gzipped js files until they're requested frequently enough. This would appear to encourage you to write a script that constantly downloads your js files to ensure that they download a few hundred milliseconds faster. I suspect that the edge cache is smart enough to only cache for one region at a time though.

like image 23
dragonx Avatar answered Sep 20 '22 00:09

dragonx