CODEWITHSUNDEEP
javascriptperformancecachingextjsextjs4
Kabeer
Kabeer

Reputation: 4236

Ext JS best practice for classes ends up with too many .js files. What about performance?

In order to achieve modularity & reuse of my custom elements / classes (extended from Ext JS classes / widgets), I am following the approach suggested in The Class System. Since I'm using most of the simple & complex widgets as well as layout containers, I am likely to end up with scores of .js files with 3 to 4 levels of namespace hierarchy (and therefore folder structure).

I am a little nervous with this approach because traditionally (with raw JavaScript) I have tried to minimize the no. of .js files. Since my page may use many of these custom elements, it will call quite a few of these .js files. Am I right to assume that this will create a huge performance bottleneck or am I thinking too much?

Next, how can I ensure that the .js files that once requested from the server remain cached in the browser at least for the session? I have observed that the .js files are always requested with a dc attribute, each time with a random number. This doesn't help the situation since all what I am requesting is a class definition file that is not changing with each request. How can I address this?

Upvotes: 2

Views: 207

Answers (1)

Domenic
Domenic

Reputation: 112827

You need a pre-deploy build step that merges all of your .js files together into a single one for download to the client. (It will also likely minify the resulting file.) Then you can serve a single file with HTTP cache headers.

Upvotes: 3

Related Questions