document.readyState で DOMContentLoaded イベントの完了を検知
何かの関数が DOMContentLoaded と関連づいているときに、その状態を検知したいときには、document.readyState が使える。 これで、どの段階かを判断して分岐のが望ましい。いままでずっとグロー …
JavaScript
Node.jsやクライアントサイドJavaScriptについて
Next.js の SSG で API キーを隠蔽する方法
よく環境変数を仕込んだり、Nuxt.js 界隈だと privateRuntimeConfig （publicRuntimeConfig – サーバーサイドからしか参照できない環境変数とフロントエンドしか参照で …
Service Worker について
Service Worker というメインのブラウザスレッドの外側で実行される特殊な JavaScript を使うことで、メインスレッドを空き状態にすることができるため、ブラウザのパフォーマンスが向上する。ブラウザのスレ …
document.referrerとは
クロスオリジンでiframeを使用する際に、子のページから親ページのURL（ドメイン）を取得する際に、document.referrerが使用できる（parent.location.href などは同一オリジンしか使用で …
別ドメインの iframe の情報を取得する方法
別ドメインの iframe 内の情報はクロスドメインのセキュリティ制約によりブラウザでエラーが発生してしまうため、通常は閲覧できないが読み込み先で postMessage を送信し、読み込み元でそのメッセージを受け取るプ …
JSの遅延読み込み属性について
上記より基本deferを使うのが、コードの書き直しの必要がなく、楽に非同期できていい。 WPでは通常では対応していないため、フックを使う必要がある。こんなかんじ。 これを説明している、いい図があった。 https://q …
続・帰ってきたシェーダー男
シェーダー学習周りについてのメモ。 開発環境 VSCode の Shader Toy（必須） Shader Toy VSCode で GLSL 開発を補助する機能拡張。リアルタイムプレビューしてくれる。 グラフ電卓 De …
帰ってきたシェーダー男
久々のシェーダーのため、復習をば。 シェーダー 3DCGレンダリングをするプログラムのこと。shade は「次第に変化させる」「陰影・グラデーションをつける」などの意味があり、「shader」は頂点色やピクセル色などを次 …
Instagram Graph API v9.0に激おこぷんぷん丸
最近v9.0試したら、v6.0くらいのときに作成した手順書通りに動かなかった。埋め込むだけなのにマジで面倒。 マニュアルとしてやったことをここにメモしておく。 まずはクライアントに下記を操作していただく必要がある。 In …
記号プログラミング基礎
記号プログラミングは、[]（配列）を多用して、文字列を取り出し、その文字列で地道にプログラムを組み立てることで成立する。 引用：https://qiita.com/acid_chicken/items/eeb0b42a1 …