概要

はてなマークのバルーン（ホバーしたら説明が出てくるあれ）をCSSで実装したのですが、キャッシュを読み込んでから最初のホバーのときになぜかちらついてしまいました。

背景

会社のアプリケーションのフロントを新しく作り変えるという業務の最中、上記のようなことが起きました。JSを使っているわけでもないので、まったくわかりませんでした。

解決法

Chromeで検証をしたところ、事前に読み込まれているはずのフォントの設定ファイルが、ホバーした時にもう一度読み込まれているようです。
ヘッダーを確認したところ。同じ記述のあるファイルが2度読み込まれていました。
片方を読み込まないようにしたら無事正しい挙動をしてくれました。