タグ: Web開発
-
Three.jsが重いときのパフォーマンス最適化まとめ【原因の測り方から】
Three.jsのサイトやゲームが重いときの最適化手法をまとめて解説。描画コールの計測、InstancedMeshによる削減(デモ付き)、pixelRatioの制限、影とライトのコスト、モデルとテクスチャの軽量化まで。
-
Three.jsでWebGLレンダラーとCSS3Dレンダラーを共存させる方法
Three.jsのCSS3DRendererで本物のHTML(iframeやボタン)を3D空間に埋め込み、WebGLのオブジェクトと正しく前後関係を持たせて共存させる実装を解説。NoBlendingの透明プレーンで深度を合わせるのがポイントです。
-
Three.jsをCloudflareにデプロイしてWebSocketで位置を同期する方法
Three.jsのサイトをCloudflare Pagesで無料公開する手順と、WebSocket(Workers + Durable Objects)でプレイヤーの位置をリアルタイム同期する仕組みを解説。タブ間で試せる同期デモ付き。
-
【Three.js入門】ビルドツール不要、CDNだけで始める基本の使い方
Three.jsをCDNのimportmapで読み込んで、HTMLファイル1枚で3D表示を始める方法を解説します。シーン・カメラ・レンダラーの3点セットとアニメーションループまで、動くデモ付き。
-
ダークモード対応のメモ
CSS変数とlocalStorageでライト/ダークモード切り替えを実装した話。
-
Astroでブログを始めました
Astroでブログサイトを立ち上げたので、構成のメモを残します。