====== IDE Labo ====== **TODO:** 以下の内容のうち DokuWiki に関する内容は整理して [[:linux:dokuwiki|DokuWiki]] に移動して、Apache に関する内容は整理して [[:linux:httpd|Apache HTTP Server]] に移動しよう。 ===== Chrome で V8 ネイティブ シンタックスを有効にする方法 ===== ネイティブ シンタックスについては、[[web:chrome#v8_ネイティブ_シンタックスを有効化する方法|Chrome V8 ネイティブ シンタックスを有効化する方法]] を参照のこと。\\ **Linux**\\ $ /opt/google/chrome/chrome --js-flags="--allow-natives-syntax" & chrome-beta の場合\\ $ /opt/google/chrome-beta/chrome --js-flags="--allow-natives-syntax" & ===== IDE ロード時間の短縮 ===== ==== クライアントサイドキャッシュの利用 ==== IDE のソースコードの大半は DokuWiki の Media によって配信されるため、** ※**settings.js** だけは即反映して欲しいので **nocache** とした。\\ require.config({ // DokuWiki media cache setting (cache=recache = cachetime setting value) urlArgs: 'cache=recache', これにより、クライアントサイドでは、DokuWiki の [管理] - [サイト設定] の **cachetime** の時間までキャッシュされるようになる。しかし、**php.ini** のデフォルト設定で **Pragma: no-cache** が付加されるため、更に以下のような工夫が必要である。\\ ==== PHP アプリが Pragma: no-cache を吐かないように設定 ==== [[linux:fedora:install_lamp|Fedora による LAMP(Apache, MySQL, PHP) 環境構築]]\\ \\ **session.cache_limiter** を **public** に設定することでも、**Pragma: no-cache** を吐かなくなるが、DokuWiki の **?do=edit (編集ページ)** までキャッシュされて動作不良を起こす。(**__この方法は上手く行かない__**)\\ ;session.cache_limiter = nocache session.cache_limiter = public 以下のように **.htaccess** を編集して、メディア配信要求に限定して **Pragma: cache** を **set** する。\\ ... RewriteRule lib/exe/fetch\.php - [E=X_CACHE_HEADER] RewriteRule ^_media/(.*) lib/exe/fetch.php?media=$1 [QSA,L] RewriteRule ^_detail/(.*) lib/exe/detail.php?media=$1 [QSA,L] RewriteRule ^_export/([^/]+)/(.*) doku.php?do=export_$1&id=$2 [QSA,L] RewriteRule ^$ doku.php [L] RewriteCond %{REQUEST_FILENAME} !-f RewriteCond %{REQUEST_FILENAME} !-d RewriteRule (.*) doku.php?id=$1 [QSA,L] RewriteRule ^index.php$ doku.php Header always set Pragma cache env=X_CACHE_HEADER ... **lib/exe/fetch.php** への要求に対して環境変数 **X_CACHE_HEADER** をセットして、メディア配信要求に限定して **Pragma** ヘッダの **cache** を **set** する。\\ ==== FireFox が確実にキャッシュを使うようする ==== FireFox だけ上記の設定を行っても、ファイルによってはキャッシュを利用しない事がある。\\ いろいろ試した結果、**ETag** を除去するとキャッシュの利用割合が増加するようだ。\\ Header unset ETag FileETag None ... **ETag** があると FireFox は余計なキャッシュ確認を行う？？\\ [[https://developer.mozilla.org/ja/docs/Web/HTTP/Caching|HTTP キャッシュ - HTTP | MDN]]\\ \\ キャッシュを無効化した際の転送量は **4.48MB** であるが、**ETag** を除去してキャッシュを有効化すると転送量は **1.88MB** まで削減できた。\\ ==== Apache の HTTP 圧縮 ==== Apache の HTTP 圧縮を有効化して html, txt, csv, css, js, json, py, wasm, data, svg などのファイルを Brotli で圧縮して配信時間を短縮している。\\ # Compress Filter Settings # AddOutputFilterByType BROTLI_COMPRESS text/html text/plain text/xml text/csv text/css application/javascript application/json application/x-python application/wasm application/octet-stream image/svg+xml ==== HTTP プロトコルを HTTP/2.0 に設定 ==== 少ないセッションで大量ファイルを転送するために、Web サーバーのプロトコルを HTTP/2.0 に設定する。\\ Protocols h2 h2c http/1.1 以上のチューニングにより IDE のロード時間はモバイル回線で以下のようになる。(DEBUG: false - js/css Minify)\\ * Chrome で最速 **161(cache on)～1500(cache off)ms** である。 * FireFox で最速 **213(cache on)～1349(cache off)ms** である。 ===== Wiki Hash ===== Don't edit!! 12ebdfd80