Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?
一方、src属性を持つ <script> タグに async 属性を付与することにより、DOM解析が中断されなくなります。JavaScriptの読込・実行とページのDOM解析が並行して行われるようになり、実行タイミングが保証されなくなります。 非同期になることにより、DOM解析が中断されずにページ表示の高速化が期待できるため、Web高速化の手法として推奨されている方法です。Lighthouseのスコアも上がります。 タイミングによってはイベントが発火しない 一見、 async 属性を追加するだけで高速化ができ、Lighthouseのスコアが上がるのであれば手当たり次第に async 属性を追加したくなりますが、そううまくはいきません。 asnyc 属性を使用しない場合(<script>)、JavaScriptのイベントリスナーを登録した後に DOMContentLoaded イベントが発火
モーダル被ってませんか？ モーダルを実装するにあたり「表示条件によって被って表示されてしまう」「例外発生時の仕組みがない」という問題に直面したことはありませんか？また、ユーザーステータスによって数種類のモーダルを異なる順番で表示したい、という要件もあるかと思います。 本項では ES2017 の async/await を使ってQueueing を実装する方法を紹介します。vanilla なので、どのフレームワークやアーキテクチャを採用していても導入出来ます。 sample: https://github.com/takefumi-yoshii/async-await-modal-queue サンプルは chrome で、babel や webpack を使用せずにそのまま実行出来ます。もちろんプロダクトコードは適宜バンドラや polyfill を利用してください。 モーダル画面を一つのPr
最低限のコストで最近よく聞くいい感じのjsを書きたい時の構成をずらーっと書いてみる 準備するもの node/npm (最近はrbenvクローンのnodenvがいい感じ、操作は同じ) webpack babel .babelrc .babelrcを設置しとくとbabelのデフォルト設定がこいつの中身で書き換わる Reactを使わないなら、presetのreactはいらない export defaultされたパッケージをimportした時に.defaultで引くのを許せるなら、add-module-exportsはいらない(後述) Reactいる { "presets": [ "es2015", "stage-0", "react" ], "plugins": [ "add-module-exports" ] } いらない { "presets": [ "es2015", "stage-0"
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
