Google Apps Script HtmlService Performance
Blog: Dave Thinking Aloud - David French
If you are moving to HtmlService from UiApp, you may encounter some performance issues. First look at the best practices. Hopefully that section will expand over time.
HtmlService introduces Caja to the mix for good or ill and the processing changes quite significantly.
To explore the performance issues around some design decisions, I developed a simple form for an upload to Google Drive. Looking forward to a time when form is as important as function, I chose to style with Twitter Bootstrap and use a bootstrap extension to style the file input component.
 |
| Simple input form |
This means that, as well as the html, there a few .css and .js files to load.
Note that this example has no submit functionality coded, just the display and upload file selection.
I produced an Apps script that simply loaded the form, using bootstrap and jQuery from CDN and additional css and js from Google Drive hosting. Published as a web app here
function doGet() {
return HtmlService.createHtmlOutputFromFile(‘bootstrap’).setSandboxMode(HtmlService.SandboxMode.NATIVE);
}
To provide a comparison with a hosted web site, I put the same html onto the Google Drive host, using the same .css and .js locations. Available here
The performance difference measured by Chrome at the desktop is quite startling. The Htmlservice script takes around 8seconds to display the form and a further 4seconds to complete loading the javascript files which make the form work. The Google Drive hosted version generally responded fully in 1.4seconds (with occasional outliers around 3.5seconds) which is not bad for a service intended for development rather than high performance service delivery.
A noticable feature of the HtmlService working is that the .js gets are sequential while the hosted version did them all in parallel.
[EDIT The results for the Htmlservice script were so bad that I explored possible workarounds. Putting the css and js files into the project and including them (as described in best practices) did improve the service time to 5-6 seconds. I could not get the jquery.min.js into the project … the copy crashed in chrome. However, this approach does rather go against the simplicity of including the scripts from a CDN.]
From this, I shall be avoiding Htmlservice wherever possible. I do prefer the separation between presentation and Google Apps function that comes from JSON-P and Javascript.
Your milage may vary of course. I am seeing this in New Zealand at the end of an ADSL link.
Leave a Comment
You must be logged in to post a comment.
