フロントエンド主導開発は可能。ただし条件を満たさないと破綻する フロントエンド主導開発とは何を指すのか 成立しないケース 成立する条件 1. クライアントの状態モデルが存在する** 2. API契約が先に定義される** 3. ビジネスルールの責務分離** SDDとの…

jQueryは本当に不要になったのかを技術的に検証する なぜ不要と言われるのか DOM取得 イベント 通信 それでも消えない理由 ネイティブJSだけでは何が困るのか 二重読み込み問題の回避 実務での判断基準 よくある誤解 軽い＝正しい 新しい＝安全 注意点 まと…

モダンJSと比較したjQueryの責務の変化 かつてのjQueryの役割 モダンJSが変えたもの DOM操作 イベント Ajax アニメーション ではなぜjQueryは残っているのか WordPressで起きている状態 以前 現在 典型例：イベント委譲 責務が減った領域 責務が残った領域 …

`document.querySelector`でjQueryは置き換えられるのか なぜ昔はjQueryが必要だったのか `querySelector`が解決したこと 置き換えできない部分 イベント管理 Ajax アニメーション WordPressで重要になる点 典型的な失敗例 ではjQueryは不要なのか 向いてい…

jQueryをネイティブJavaScriptへ移行する手順 なぜ単純削除が危険なのか 手順1：まず依存箇所を特定する 手順2：document.readyを置き換える 手順3：DOM取得の置き換え 手順4：イベント処理の移行 手順5：クラス操作の置き換え 手順6：Ajax通信 手順7：jQuer…

`$`が競合する理由と`noConflict()`の役割 `$`は特別な記号ではない 競合は実際に起きる `noConflict()`が何をしているのか 実際の状態の変化 WordPressが必ずnoConflictを使う理由 ではどうやってjQueryを書くのか よくある誤解 1. jQueryが壊れていると思…

jQueryは消えていない。むしろ「消せない」 Webアプリと業務画面は別物 導入コストの差 サーバサイドとの相性 既存システムという現実 小さな機能追加に強い 注意点 最後に jQueryは消えていない。むしろ「消せない」 jQueryはもう使われていない、という話…

jQueryは古い技術だから嫌われているわけではない かつてjQueryが必要だった理由 現在のJavaScriptの変化 「書きやすさ」の逆転 モジュール化との相性 誤解されやすいポイント なぜ「古い」と感じるのか 最後に jQueryは古い技術だから嫌われているわけでは…

jQuery UIは「機能を増やしたから」巨大になったわけではない 当時のブラウザ環境の現実 jQuery UIの中身はコンポーネントではない ウィジェットファクトリという設計 CSSの問題も背負っていた 実際の現場で起きていたこと なぜ現在は使われなくなったのか …

「jQueryのプラグイン文化」は偶然ではない なぜコアを小さく保つ必要があったのか プラグインを可能にした技術 ― $.fn なぜ開発者が爆発的に参加したのか 典型的なプラグインの構造 失敗しがちだったポイント そして「jQuery UI」が巨大化した理由 最後に …

jQueryアニメーションは「同時」に動いていない キューとは何か どのように動いているか コードで見るキュー なぜキューが必要だったのか よくある問題「連打」 `stop()`の役割 キューはアニメーション以外にも使われる `delay()`の正体 `queue:false`とは …

`fadeIn()`と`slideUp()`は魔法ではなく「数値の更新ループ」 `fadeIn()`の内部動作 `slideUp()`の内部動作 なぜCSSアニメーションではないのか イージングの仕組み アニメーション中に起きていること `stop()`が必要になる理由 なぜカクつくのか 現代との違…

`hide()`はただのdisplay:noneではない CSSの`display:none`とは何をしているのか jQueryの`hide()`がやっていること `show()`との関係 CSSと混ぜると起きる問題 アニメーション時の違い `visibility:hidden`との違い よくあるバグ 1 表示が戻らない** 2 ア…

jQueryが遅くなるのは「数が増えたとき」 DOMは配列ではない jQuery特有のコスト 典型的な遅いコード なぜ途中から急に遅くなるのか もう1つの落とし穴「再検索」 最も重い処理「読み取り＋書き込み」 正しい対処法 実務で起きやすい場所 注意点 最後に jQue…

「jQueryは遅い」は本当にjQueryのせいなのか DOM操作はJavaScriptではない jQueryは何をしているのか なぜ昔は問題にならなかったのか 状況を変えたのはJavaScriptエンジン セレクタがボトルネックになる理由 ループで顕著に現れる さらに影響が大きかった…

jQueryは「便利」だったから普及したのではない そもそもDOM操作とは何か 昔のブラウザは「同じJavaScript」が動かなかった DOM操作はなぜ重かったのか jQueryが解決した「互換性問題」 jQueryが解決した「パフォーマンス問題」 なぜjQueryは必須だったのか …

jQueryのthisが混乱を生む理由 JavaScriptのthisは固定ではない jQueryオブジェクトのthis イベント処理に入るとthisが変わる $(this) が必要になる理由 典型的なバグの原因 アロー関数で壊れる理由 なぜjQueryはこの設計になったのか 実務上の注意点 まとめ…

jQueryのチェーンメソッドはなぜ成立するのか そもそもjQueryは何を返しているのか チェーンメソッドの正体 ― return this なぜreturn thisが重要なのか ではreturn thisは常に正しいのか thisがjQueryで混乱を生む理由 実務で起きる失敗パターン jQueryチェ…

$()は関数ではあるが「DOM要素」を返していない $()の戻り値 ― jQueryオブジェクト 中身は配列に近い構造 なぜわざわざラップしているのか $()はセレクタ関数ではない jQueryオブジェクトとDOMの違いで起きる問題 なぜこの設計になったのか 現在との違い 注…

window.onloadと$(document).ready()の違いは「速さ」ではない ブラウザは同時に処理していない DOM構築の流れ window.onloadが遅い本当の理由 イベントループから見た違い なぜjQueryはreadyを提供したのか 実際に起きていた問題 現在はどうするべきか 注意…

$(document).ready()はなぜ使われていたのか HTMLとJavaScriptは同時に動いていない DOMが完成する瞬間 ― DOMContentLoaded 問題はブラウザ対応だった $(document).ready()の本当の役割 window.onloadとの違い 本当に必要だったのか 現在はどうなったか 注意…

なぜ昔のJavaScriptはブラウザごとに動かなかったのか DOMという最大の不一致 DOMは共通規格だったが共通実装ではなかった イベントモデルの違い CSS操作も統一されていなかった Ajaxの互換性問題 ここで登場したjQueryの役割 jQueryは「機能」ではなく「翻…

jQueryが爆発的に普及した本当の理由 2000年代のJavaScriptは「ブラウザごとに別言語」だった DOM APIがブラウザごとに違った イベント処理も統一されていなかった jQueryがやったこと ― 抽象化 AjaxがjQuery普及を決定づけた なぜ一気に世界標準になったの…

コーディングを理解するとデザインの評価軸が変わる なぜデザインと実装は衝突するのか ブラウザは“画像”を表示していない よくある問題の正体 文字量による崩れ フォント差異 画面幅 コーディング理解で起きる変化 JavaScriptが関係する領域 外注・分業での…

フロントエンドは「見た目担当」ではない どこに存在しているのか 何をしているのか 画面を作る 操作を受け取る サーバーと連絡する なぜ分かれているのか よくある誤解 フロントエンド＝デザイン 簡単な領域 注意点：フロントエンドだけでは完結しない まと…

ブラウザは「サイトを表示するソフト」ではない OSとは何をしているものか ブラウザがやっていること 画面を作る プログラムを実行する 通信を管理する 入力を扱う なぜOSに近づいたのか 安全性の仕組み なぜ重要なのか 注意点：万能ではない まとめ ブラウ…

SPAは「新しいページ」を開いていない 普通のWebサイトの動き SPAの動き なぜアプリのように見えるのか SPAが使われる場面 メリット 注意点：最初はむしろ遅い よくある誤解 SPA＝最新で優れた方式 SPA＝表示が速い まとめ：SPAの本質 SPAは「新しいページ」…

最近のWebは「ページ」を開いていない 昔のWeb：文書を取得する仕組み 現在のWeb：必要なデータだけ取得する 何が起きているのか（内部の流れ） なぜこの方式に変わったのか スマホの影響 メリット 注意点：万能ではない 何が変わったのかの本質 最近のWebは…

JavaScriptは「便利な技術」ではなく「問題児」だった時代がある 理由1：ブラウザごとに動きが違った 同じコードが別の結果になる Internet Explorer問題 理由2：セキュリティの不安 勝手に何かが起きる印象 情報を盗まれるのではという恐怖 理由3：とにかく…

WordPressが急に重くなるとき、サーバーが原因とは限らない WordPressの表示は2段階で行われている 「読み込みが終わらない」の正体 プラグインが増えるほど遅くなる理由 スマホだけ遅いのはなぜか 広告とアクセス解析が特に重い理由 テーマ変更で遅くなる理…