LoginSignup
1
0

More than 1 year has passed since last update.

for文で生成するFont AwesomeのSVG描画が遅い問題

Last updated at Posted at 2022-09-14

Font AwesomeのKitではTechnology(描画方式)として、Web FontかSVGか好きな方を選べるのですが、うっかりSVGを選んでしまうと描画がかなり遅くなります。10倍くらい時間がかかると思ってください。

これはFont Awesomeに限らず、そもそもSVGの中身はXMLであり、余分な情報がたくさん盛り込まれているためです。

そのため、データ数が増えれば増えるほど指数関数的に遅くなるので、AngularやReactなどでFont Awesomeのアイコンをループ生成する際は、Web Fontを選んでおくほうが懸命です。

作成していたWebアプリで「最近非同期データの読み込みが遅いなぁ」「データ量増えたからかなぁ」と思っていたら、アルゴリズム起因ではなくビュー描画起因だったというオチでした。確かにビューの描画処理って重いんですよね。

1
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
0