search

learningequality / ka-lite

KA Lite: lightweight web server for serving core Khan Academy content (videos and exercises) without needing internet connectivity
https://learningequality.org/ka-lite/
Other
456 stars 306 forks source link

Optimize Learn tab critical rendering path #2621

Open aronasorman opened 9 years ago

aronasorman commented 9 years ago

The Learn tab is the most used section of the app, but it also loads a large amount of assets that significantly increase the page load time. Bringing it down to a sub-1 second loading time even for the Ainol tablets would be a significant improvement in the user experience for students.

Related to #2618.

rtibbles commented 9 years ago

I think that part of this will be in devising a more sophisticated API (actually an API rather than a json file) for loading topic data.

jamalex commented 9 years ago

Yeah, a good portion of that initial JS time may also be spent in recursively parsing the entire topic tree and converting it to Backbone models and collections.

rtibbles commented 9 years ago

I would also reiterate here that having properly built client side resources (js and css) will probably be our biggest win here. To quote https://developers.google.com/web/fundamentals/performance/critical-rendering-path/optimizing-critical-rendering-path

Minimize the number of critical resources. Minimize the number of critical bytes. Minimize the critical path length.

Number of critical resources would be drastically reduced by compiling our js and css files into bigger chunks, and reducing the critical bytes can be managed by making the 4.8Mb Topics.json unnecessary on first page load.