backbone.jsなどのjsライブラリで画面生成されるアプリだと、javascript部分のパフォーマンスがアプリのさくさく感にすごい影響を与える。特に、レンダリング部分がトロいと、画面スクロールとか最初の画面生成にもたつきが発生して、いちいち引っ掛かりを感じるアプリとなってしまう。 では実際のところ、どう書いたら性能良くなるの?、ということでネットをさまよってると、「DOM操作を極力なくせ」、というのが共通の見解のようだ。 例えば、イテレーションの中で一つ一つappendするのではなくてまとめてappendしたほうが良いとか、そもそもappendじゃなくて文字列でinnerHTMLに入れたほうが良い、一度作ったDOM構成をcloneして使うと良い、cloneしたDOMを操作してからreplaceしたほうが良い、とかいろいろTIPSが出てくる。 そんなわけで、自分として気になるtips
![DOM操作のパフォーマンス - Qiita](https://cdn-ak-scissors.b.st-hatena.com/image/square/7581a4b1e7ee0b0661a55c2a088ed03446b25ff8/height=288;version=1;width=512/https%3A%2F%2Fqiita-user-contents.imgix.net%2Fhttps%253A%252F%252Fcdn.qiita.com%252Fassets%252Fpublic%252Farticle-ogp-background-9f5428127621718a910c8b63951390ad.png%3Fixlib%3Drb-4.0.0%26w%3D1200%26mark64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTkxNiZoPTMzNiZ0eHQ9RE9NJUU2JTkzJThEJUU0JUJEJTlDJUUzJTgxJUFFJUUzJTgzJTkxJUUzJTgzJTk1JUUzJTgyJUE5JUUzJTgzJUJDJUUzJTgzJTlFJUUzJTgzJUIzJUUzJTgyJUI5JnR4dC1jb2xvcj0lMjMyMTIxMjEmdHh0LWZvbnQ9SGlyYWdpbm8lMjBTYW5zJTIwVzYmdHh0LXNpemU9NTYmdHh0LWNsaXA9ZWxsaXBzaXMmdHh0LWFsaWduPWxlZnQlMkN0b3Amcz03YjY2NDdlYjQwOGI4YTRlYTI5NTg1MGZjZDAwNDI5OQ%26mark-x%3D142%26mark-y%3D112%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTYxNiZ0eHQ9JTQwaGFsaGlkZSZ0eHQtY29sb3I9JTIzMjEyMTIxJnR4dC1mb250PUhpcmFnaW5vJTIwU2FucyUyMFc2JnR4dC1zaXplPTM2JnR4dC1hbGlnbj1sZWZ0JTJDdG9wJnM9ZGZhZmRhNzE1NzVjMmVjZmI2MjhmYWJhYTIyNjhhZjM%26blend-x%3D142%26blend-y%3D491%26blend-mode%3Dnormal%26s%3Dfbc6e9b49264c5ea55c50372beaf4c5c)