ExtJS Faster Loading

Published on 6/25/2012

---

Here’s how to make your app appear to load faster. It’s a trick used in iOS programming:

1. take a screenshot of your application, in its initial but loaded state *
2. blur or mask this image somewhat
3. load this image first, and set it as the HTML background image
4. load ExtJS and your application
5. start your application
6. the app will start and show its interface, and the viewport will cover the HTML background

To make sure an image loads first, put this script at the top:

(new Image()).src = 'path to your startup image';

To set it as the background image, add this style to your index page:

html {
  background-image: url('path to your startup image');
  background-size: 100%;
}

You should also, of course, use Sencha SDK Tools to compress and minimize your files.

* remove any user-specific or time-sensitive info

... views