vueでスクロール検知 - webhttps://jp.vuejs.org/v2/cookbook/creating-custom-scroll-directives.html 公式のこれが一番手っ取り早い code:js Vue.directive('scroll', { inserted: function (el, binding) { let f = function (evt) { if (binding.value(e
カスタムスクロールディレクティブの作成 — Vue.js
最終更新日: 2018年3月20日 基本的な例Web サイト上でスクロールイベントと連動するアニメーションなど、ちょっとした振る舞いを加えたくなる時は多くあります。やり方は多くありますが、最も少ないコード量と依存で実現できる方法はおそらく、特定のスクロールイベントを発火させるフックを作成する、カスタムディレクティブを使用することでしょう。 Vue.directive('scroll', { inserted: function (el, binding) { let f = function (evt) { if (binding.value(evt, el)) { window.removeEventListener('scroll', f) } } window.addEventListener('scroll', f) } }) // main app new Vue({ el: '
Lighthouseを使ってVuex.jsで書いたポートフォリオサイトを爆速化する - Kekeの日記
本記事はVue.js Advent Calendar 2018の第3日目の記事です。 はじめに GCPの無料枠が終了したため、ポートフォリオサイトはクローズドしましたが、引き続き本記事はご覧いただけます。 私は以前、インターンシップなどの選考に備えて自分のポートフォリオサイトなるものを作りました。 しかし、あまりに速くデプロイしたかったことからパフォーマンスについて一切無視した結果、とてつもなく遅いサイトができてしまいました。 結局、他人に見せるには恥ずかしいサイトになってしまい、今回の記事で爆速にできればと思います。 サイトはこちらで、SEO対策やOGPも実装したので以下のように展開されます。 要約 自分のポートフォリオサイトがロードまで8秒近くかかっていたのがキャッシュ込みで0.3秒くらいになった クリティカルレンダリングパスを知ることが重要 Chrome DevToolを使い倒すとよ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
