今回のアップデートで追加された機能で割と素敵なのが
HtmlServiceのSandboxModeです。
今回はこのSandboxモードについて書きます。
なお、細かい話は後半に書きます。
Sandboxモード
Sandboxモードは二種類あります。
- EMULATED
- NATIVE
HtmlServiceはなにも設定しないとEMULATEDモードで動きます。
Sandboxモードを設定する
Sandboxモードを設定するにはHtmlServiceから作成できる、
HtmlOutputのsetSandbocMode()メソッドを使います。
function doGet(e){
return HtmlService.createHtmlOutput('').setSandboxMode(HtmlService.SandboxMode.NATIVE);
}
SandboxMode.NATIVEを設定するとどうなるの？
単純に書くと、
問題が起きるかもしれないけど、
一部のブラウザでJSの実行速度が上がり、
使えなかったライブラリが一部使えるようになり、
うまく動かなかったCSSが動くようになります。
何それ素敵
なんで？
それを説明するにはいろいろな話をする必要があります。
HtmlServiceの問題点
HtmlServiceはGASのUIとして、HTMLやJS,CSSを使うことができ、
素敵そうに見えるのですが、いくつかの問題点があります。
- 既存のクライアントサイトのJSライブラリの一部(というかかなりの数)が使えない
- CSSも、かなりの設定が使えない
- クライアントサイドJSが遅い
嫌になりますね。
これらの問題は、ほぼ一つの理由により発生しています。
それは
cajaを使ってるから
cajaって？
簡単に言うと(というより難しい話知らん)、
JavaScriptやCSS,HTMLをよりセキュアに実行するための仕組みです。
JS内にある危険なコードなどを上手いこと動かないようにして、
ユーザにとって安全なwebサービスを利用出来るようにしています。
cajaは何をしてる？
かなり色々やってます。
- JS、CSS、HTMLを解析して危険なコードがある場合は除去したり、エラーを出す
- それらを安全な形に変換する
ほかにもたくさん。
なんで遅くなったり問題が出るの？
この変換の部分にかなり時間がかかっているのと、
変換後のスクリプトが色々なチェックが入っていて遅くなるようです。
またECMAScript3(ES3)しか対応していないブラウザをECMAScript5(ES5)に対応させる変換する処理を行なっています。
しかもES5が動くブラウザに対しても強制的にこれを実行してます。
NATIVEモードでやってる事
NATIVEモードではこのES3からES5に対応される処理をES5に対応していない
ブラウザのみ実施し、
ES5に対応しているブラウザでの無駄な変換処理や、上書き処理を減らしています。
これにより無駄がなくなり早くなるようです。
※他にもやってるみたいですが
また制約も緩やかになるため、使えるライブラリも増えるようです。
まとめ
携帯から書いたので乱文になりましたが
とりあえず、NATIVEモードを使ってみて下さい。
なお、実験的な機能なので使う場合は自己責任でお願い致します。