UXを向上させる、InstantClickを試してみた。

2行追加するだけでWebサイトを高速化するInstantClick.io – atskimura-memoという記事を見つけて、実際使ってみました。

1)スクリプトのダウンロードはこちらから
2)とりあえず、このブログに試してみるため、instantclick.min.jsを/js/に保存
※このブログは/blog以下をWordpressでやってるちょっと変則使い方です。
3)テンプレートのindex.phpを開いてざっくりとコードを追加。

<script type=”text/javascript” src=”/js/instantclick.min.js” data-no-instant=””></script>

<script type=”text/javascript” data-no-instant=””>// <![CDATA[

InstantClick.on(‘change’, function() {
ga(‘send’, ‘pageview’, location.pathname + location.search);

});
InstantClick.init();
// ]]>

</script>

上記で動作しました。実際、クリックしたときの気持ちよさが変わったんですが、問題が一つ。
/blog以下からトップや、Sampleに移動するとCSSが切れてしまう状態となりました。
同一ドメインの場合に何かあるかも？って感じですが時間がないので、一旦終了。

【結論】
instantclickは使えます。まだGoogle Analyticsの結果等見てないですが、、、
アクセスも問題なくとれば、かなり気持ちのよい動作を簡単に提供できるスクリプトです。

上にあった問題を調査して、対応できたらまた書くぞと。。

関連