notebook

都内でWEB系エンジニアやってます。

mkdocsの検索を日本語に対応させてみる

mkdocsのサイト内検索で日本語検索に対応していないという話があったので対応させたいなと思い調べてみた

中身を読んだらlunrという全文検索ライブラリを用いているよう

jekyllにもlunr.jsを使ったプラグインがあるようで結構有名なのかな

で、このlunr.jsがデフォルトだと日本語での検索に対応していない

しかし、幸いなことに日本語対応の方法も既にあるらしいので、下記を参考に対応してみる

lunr-languages

lunr.jsの多言語対応用ライブラリ

サイトに従って修正していけば日本語にも対応できそう

見ながら修正した結果無事日本語検索ができるようになりました

f:id:swfz:20160222234151p:plain

なので既存のmkdocsのsearch.jsに対してのパッチを作った

これで日本語検索もできるようになりました!めでたしめでたし!

課題

検索できました、良かった!と思ったのですがとても重い

すべての画面でjsの読み込みが発生していてページ遷移するたびに10秒くらい待たされてブラウザ上で操作できない

プロファイルをとってみると上記で入れたtinysegmenterというのが悪さをしているよう、再帰呼び出しをしていてとても重くなっているところまで判明しました

リファクタリングするかとも思ったけど、中身見た感じ ~~ 正直よく分からない ~~ 時間かかりそうだったので一旦検索のモーダルが表示された段階(検索機能を使用する)でjsを読み込むように変更しました

  • custom/js/baes.js
+ function loadSearchJs(){
+   var scriptElement = document.createElement('script');
+   scriptElement.setAttribute('data-main', base_url + "/mkdocs/js/search.js");
+   scriptElement.src = base_url + "/mkdocs/js/require.js";
+   document.body.appendChild(scriptElement);
+ }

.....
.....
.....

    // make sure search input gets autofocus everytime modal opens.
    $search_modal.on('shown.bs.modal', function () {
+      loadSearchJs();
        $search_modal.find('#mkdocs-search-query').focus();
    });

根本解決にはなっていないのですが、毎度ページが読み込まれるたびに固まることはなくなったので少しは使えるように

site/mkdocs/search_index.json というファイルにすべての記事のインデックス情報が格納されていて現状16Mあったので、そりゃ重くなるわな、、、といったところ

他の小さいサンプルで試したらさくさく動いてくれたのでどのくらいで重くなってくるのかはちょっと気になるところです

なので、文書量の問題というクリティカルな問題を残したままw

規模が大きくなってきたらそもそもクライアント側だけでっていうのは難しいかもしれませんね

何かアドバイスなどあれば教えていただきたいです!

で、今回行ったことをgh-pagesにあげて終わり

他にも機能つけたけどそれはまた後日に

mkdocs_sample