メモ
ブログ
フロントエンド開発、SEO、AI、分析、そして実際のプロダクト開発についてのメモ。
42 記事
「Guaranteed Resources — No Sharing」のはずのAVA Hosting VPSで、CPU Stealが平均32.73%だった
AVA HostingのKVM VPSを通常の本番トラフィック下で計測したところ、CPU stealは平均32.73%、CPU idleは0%、CPU pressureは約99%でした。これは否定的なレビューではなく、VM内部でLinuxが実際に何を示したのかを記録した実体験ベースのデバッグ記事です。
FDCServersのVPSは3 TB超のトラフィックまで正常だった。それが突然、ディスク読み込みに18秒かかるようになった
FDCServersのVPSは当初、実トラフィックを問題なく処理し、3 TBを超えるデータを転送していました。ところが通常の負荷で仮想ディスクの深刻なstallが発生するようになり、CPU iowaitは100%、LinuxのI/O pressureはほぼ100%、read latencyは18.7秒、flush latencyは53秒超に達しました。
トラフィックをゼロにしても、REGXAのVPSでCPU Stealが94%になった
REGXAのKVM VPSで深刻な性能問題を調査したところ、CPU stealが92〜94%、localhostへのHTTPSリクエストが数秒、接続キューが増大し、HTTP 504まで2分以上かかる状態を確認しました。production trafficをすべて外した後もCPU stealは94.17%まで上昇し、REGXAのサポートは最終的にshared infrastructure上のresource contentionが原因だと説明しました。
Nginxの背後でBunny Storageを2か月使って分かったこと――画像・動画・音声を専用メディアサーバーへ移した理由
Bunny CDNは使わず、Bunny Storageを自前Nginxキャッシュのprivate originとして2か月運用した。Production logから、cold mediaでのlong-tailな接続timeoutと、MP4におけるNginx SliceとETag不整合という別の問題が見え、最終的に単純なprivate media originへ移行した。
WebPからAVIFへの再圧縮でSSIMULACRA2をどう使うか：元ソースは60、既に非可逆圧縮された素材は65にした理由
すでに非可逆圧縮されたWebPからAVIFを作る場合、SSIMULACRA2が測るのは2世代目の劣化だけです。そのため、良好な元ソースには60/58、既知の非可逆圧縮派生物には65/63を使っています。
DeepSeekが値上げしたので、同じV4 Flashを旧料金より安く提供するホストを探してみた
8月17日の朝、DeepSeek APIの支出が普段のおよそ5倍になっていることに気づきました。その後、同じDeepSeek-V4-Flash-0731 checkpointを提供する別のプロバイダーを見つけて実際に試したところ、現在の料金はDeepSeekの旧料金より約45%安い水準でした。
フレームやタイミングを壊さずアニメーションWebP・GIF・APNGをH.264 MP4へ変換する方法
本番処理では、ユーザーが実際に見る完全なフレームを再構成し、元のタイミングを保ち、最終MP4ごとに一つのCFRを選び、拡大せず最小の共通キャンバスを使います。互換なH.264セグメントをエンコードし、二度目の非可逆エンコードをせずに連結し、ファイル本体とHTTP配信の両方を検証します。実測した一例では、合計1.49 GBの217個のアニメーションWebPが78.49 MBのH.264 MP4一本になりました。
ブラウザエラーを片っ端から通知していた私が、ノイズを本当に使える本番監視へ変えた方法
最初のフロントエンド監視は、広告ブロック、GTM の失敗、AbortError、情報の乏しい Script error、実際の Next.js チャンク障害まで同じ「エラー」として通知していました。そこで、所有元・ユーザー影響・証拠の質・相関・復旧を軸に監視を作り直しました。
古い Next.js タブがデプロイ後に壊れる理由：古い HTML、消えたチャンク、バージョンずれ
あるデプロイ後、本番監視で自分の Next.js アプリに属するチャンクの読み込み失敗を記録しました。ログが証明していたのは失敗が起きたことだけで、原因ではありません。この記事ではその事例を起点に、長時間開いたタブ、古い HTML、欠落した /_next/static リソース、バージョンずれ、旧資産の保持、deploymentId、公開順序、監視、制御された復旧を整理します。
CFRを壊した1 tick：なぜ5580は5625ではなく、3751は3750ではなかったのか
16 fpsのMP4で、あるパケットの継続時間が5625ではなく5580 tickだったため、検証処理が何度実行しても出力を拒否しました。その後、24 fpsで本来3750 tickになる箇所に3751を検出しました。2つの障害から、ソースのタイミング、CFRへの量子化、MP4のタイムベース、PTS/DTS、マルチプレクス処理、パケット単位の検証を切り分ける必要性を学びました。
H.264のまま本番動画を約280 MBから約50 MBまで削減した方法
実運用の動画1本が、CRF 28、x264 veryslow、720p級の解像度上限、有効なフレームレート、控えめなデコーダー要件を中心にH.264設定を組み直したことで、約280 MBから約50 MBまで縮小した。さらに前の段階では同じ例が約350 MBから238 MBまで縮んでおり、旧ライブラリの調査では毎秒数メガビット級のH.264が珍しくなかったことも分かった。
「サイトが落ちている」だけでは足りない。GitaeでDNS・TLS・経路まで切り分ける
Gitaeは「サイト自体が落ちているのか、それとも自分の環境だけの問題なのか」を切り分けるために作った診断ツールです。モスクワとヘルシンキの外部VDSから、DNS、HTTPS/TLS、ポート、経路、IP、ホスティング、CMSのシグナルを確認し、結果を断定ではなく診断材料として扱います。
本番開発でCodexとTypeScriptの相性が非常に良いと感じる理由
本番開発では、TypeScriptがCodexにプロンプトだけでは与えられないものを提供します。機械的に検証できる契約、素早いコンパイラのフィードバック、そして大規模なリファクタリングを安全に進めるための道筋です。
Jurfi.comを作った理由：構造化された法務ドラフトを作るブラウザ型ドキュメントスタジオ
Jurfi.comは、フォームとテンプレートから構造化された法務文書の作業ドラフトをブラウザ上で作るために開発したサービスです。ドラフトはローカルに保持でき、レビューを前提とし、ソフトウェアが弁護士の代わりになるとは考えていません。
初めてのSaaS売上。1件の支払いが本当に証明したこと
自分で作ったSaaSから初めて受け取った支払いは小さなものでしたが、手元にある証拠の質を変えました。1件の取引で何を検証でき、何はまだ証明できないのか。そして、なぜ節目そのものより再現性が重要なのかを整理します。
Codexで15のプロジェクトをレビューしながら、最終判断は自分で持ち続ける方法
15のソフトウェアプロジェクトをレビューする作業は、以前なら反復チェックだけで膨大な時間が必要でした。Codexを使うことで、バグ、テスト、SEO、翻訳、ローカライズ、整合性チェックを大幅に速く進められるようになりました。ただし、AIの指摘は結論ではなく仮説として扱い、変更内容は必ず自分で検証しています。
ChatGPT PlusのCodex上限、残り3〜5％で重い開発タスクを始める理由 — Update：2026年夏にはこの方法が通用しなくなった
Update：2026年夏までに、このワークフローは私の環境では安定して使えなくなった。アカウントから5時間枠の表示が消え、週次上限だけが見える状態になり、長時間のタスクは週次上限を使い切ると途中で止まることがあった。
AIでSEO記事を1万本公開した結果、Googleのインデックスが0ページになった
大量のAI記事は最初、SEOの近道に見えました。Googleは生成した1万本の記事URLをすべてクロールしましたが、実際にインデックスされ、検索結果に表示されてトラフィックを生んだのは約1,000ページでした。その後、その約1,000ページも徐々に消え、最終的にはサイト全体のインデックス数が0になりました。この失敗から学んだAI、SEO、翻訳、そしてAIを「作者」ではなく「補助者」として使う考え方を書きます。
8GB/256GBのM1 MacBookを5年間使って分かった、まだ買い替えていない理由
約1000ドルで買った8GBメモリ・256GB SSDのベースモデルM1 MacBookを、開発、動画・音声処理、画像処理、執筆、学習、サイドプロジェクトに1日およそ15時間使ってきました。5年後の今は限界も見えますが、買い替えを考える理由は故障や実用性の低下ではなく、自分のワークロードが大きくなったからです。
ChatGPTでブログを20言語に翻訳したら、世界中から検索流入が来るようになった
AIによって多言語ブログのコスト構造が変わった。1言語だけで書いていたブログを最大20言語で公開するようにした結果、各言語の検索ページが世界中の読者との新しい入口になった。
無料の静的QRコード生成ツールとしてQRVizを公開し、集客はSEOに賭けた
QRVizはキャンペーン管理サービスではなく、ブラウザで使う静的QRコード生成ツールです。 qrviz.com を無料のQRコード生成ツールとして公開しました。広告予算、有料集客、収益化ファネルはありません。集客はSEOだけに頼っているため、最大の不確実性は「作れるか」ではなく「見つけてもらえるか」です。
SaaSを作るより顧客獲得のほうが難しいと感じた理由
SaaSを作った実体験から得た教訓です。エンジニアリングには明確で検証しやすいフィードバックがある一方、集客、ポジショニング、メッセージ、Retentionには別の、ずっと予測しにくいループがありました。
SaaSプロダクトを一人で作った。決済を始めて「仕事」の意味が変わった
このプロダクトを夜や週末、休日を使って一人で開発した。決済を有効にした瞬間、バグ、オンボーディング、モデレーション、リテンション、信頼性は「後で考えること」ではなく、実際のプロダクト運用そのものになった。
I Got 550 Views from One Image, Voiceover, and Subtitles: What Three Shorts Tests Actually Taught Me
A simple YouTube Short built from one static image, a voiceover, and subtitles reached 550 views. After three early tests, the useful lesson was not a proven formula, but a repeatable way to experiment without confusing a promising signal with proof.
モスクワのフロントエンド求人で応募が約6,000件。そこから言えること、言えないこと
2023年末、採用担当者から「1求人に300〜500件の応募が来る」と聞いた時点で十分に競争が激しいと感じていました。ところが2026年1月20日、モスクワのミドルレベルのフロントエンド求人で、公開から数時間のうちに応募数が6,000件近くまで伸びているのを目にしました。この数字が示すものと、逆に証明できないものを、候補者側の視点から整理します。
DeepSeekでNode.jsの個人開発が変わった：半年で4,000件超のコミット
2025年のGitHubグラフは、前半ほぼ空白だったのに対し、後半だけで4,000件を超えるcommitになりました。この記事では、AI codingがNode.jsの個人開発workflowをどう変えたか、どこで時間を短縮でき、どこで失敗し、なぜ生成速度より検証が重要だったのかを振り返ります。
My First TikTok at 28: What a Vertical Product Demo Taught Me About Traffic
At 28, I posted my first TikTok and cross-posted the same product demo to Reels and Shorts. The useful lesson was not the view count: it was how much a 9:16 frame changes a desktop interface, and how to measure short-form traffic without confusing reach with acquisition.
25年物のドメインを買ったら、消えたURLに1日1,000件超のリクエストが来た
2000年に初めて登録されたドメインで新サイトを公開した直後、旧URLに1日1,000件超のリクエストが届き、Yandex Webmasterには一晩で900件超のエラーが出ました。実際に確認できた事実と推測を切り分け、410を限定的に使った理由と、今なら履歴のあるドメインをどう監査するかを整理します。
Yandex に 12,500 ページがインデックスされていたのに、ロシアからの流入はほぼゼロだった：見落としていた Cloudflare の問題
Yandex には 12,500 ページがインデックスされていた一方、ロシアからのトラフィックはほぼゼロでした。原因をネットワーク経路まで切り分け、Cloudflare のプロキシを無効化し、VDS 上の Nginx にキャッシュ・圧縮・基本的な保護を移して到達性を回復しました。重要だったのは、インデックス・到達性・トラフィックを別々に見ることです。
静的な Next.js サイトには毎日数千件の脆弱性スキャンが来る。それでも Nginx はほとんど動じない
ログには WordPress、PHP バックドア、.env、.git/config を探すリクエストが大量に残ります。しかし静的な Next.js + Nginx 構成では、その多くが低コストなミスと 404 で終わり、観測中の CPU 負荷も変わりませんでした。静的サイトの安全性について、この経験から言えることと言えないことを整理します。
新規サイトで Yandex は伸びたのに Google はほとんど動かなかった
同じ新規プロジェクトで、Google Search は長期間で約300クリックにとどまった一方、Yandex Webmaster ではクリック数が +500% と表示されるほど上昇しました。この数字から確認できること、確認できないこと、そしてクロール・インデックス・ランキング・トラフィックを混同せずに差を調べる方法を整理します。
Yandex が Next.js の 4,278 ページを一晩でインデックスした。そこで本当に確認できたこと
Next.js で静的生成した 4,278 ページが、ほぼ一晩で Yandex のインデックスに入りました。これは確かな技術的マイルストーンでしたが、順位やトラフィックの成功を証明するものではありません。SSG とプログラマティック SEO について、この結果から言えることと言えないことを整理します。
SEOを1か月実践して分かったこと：オーガニック632人と怪しいボットトラフィック
仕事で予定していた大きなSEO施策に備え、個人のサイドプロジェクトを実験環境にしました。1か月でオーガニック訪問者は632人まで増えましたが、83人を記録した日の分析から、怪しいトラフィックや計測ツールの見え方を成長と取り違えない重要性を学びました。
Yandex Webmasterを危うく無視しかけた。2週間後、Googleより多くの流入が来ていた
SEOが重要な仕事のプロジェクトに備えて、Next.jsのサイドプロジェクトで実践しました。最初の2週間はGoogleから58人、Yandexから200人が訪れ、流入・インデックス・診断を別々に見る重要性を学びました。
Yandex Metrica vs Google Analytics：1週間併用して私が Metrica を選んだ理由
新しいプロジェクトで Google Analytics と Yandex Metrica を1週間並行運用しました。私が Metrica をより頻繁に使うようになった決め手は Webvisor のセッションリプレイです。ただし、これは自分の作業フローに合っていたという結論であり、どちらが万人にとって優れているかを証明する比較ではありません。
Yandex が /en なしでブログをクロールした。308 リダイレクトが 404 を防いだ話
約3,000ページの /en/blog/... URL を sitemap に追加した後、Yandex が対応する /blog/... をクロールしようとしているのを確認しました。事前に設定していた 308 リダイレクトのおかげで 404 にはなりませんでした。この経験から学んだのは「Yandex が sitemap を壊した」という話ではなく、URL 設計にどれだけ耐障害性を持たせられるかという点です。
新規サイト2つでGoogle流入が急増し、数日後に約10分の1まで落ちた
2回のローンチで、公開直後にGoogleのインプレッションが急増し、数日後にはトラフィックが約10分の1まで低下しました。現象そのものは確認できましたが、いわゆる「Googleハネムーン」が原因だとは証明できません。
Yandex検索から一晩で2,000ページが消えた。そこで本当に分かったこと
Yandex Webmasterを開くと、約8,000ページのうち2,000ページが検索に参加しなくなっていました。25%という大きな下落でしたが、重要だったのは「観測できた検索状態の変化」と「証明できた原因」を混同しないことでした。
MoscowJS 66で10個以上質問し、賞品を2つ獲得した
MoscowJS 66で、Telegramボット、LangChain.js、サイトビルダーのアーキテクチャ、TypeScriptの型テストに関する発表を聞きながら10個以上質問しました。そのうち2つが「ベスト質問」に選ばれ、賞品を2ついただきました。
PiterJS #79で得たもの：レガシーモノリス、FrontOps、Webパフォーマンス、そして良い質問
サンクトペテルブルクのPiterJS #79は、既存システムの保守に焦点を当てた回でした。レガシーモノリス、FrontOps、Webパフォーマンス指標について実用的なメモを持ち帰り、Q&Aでは2つの賞も受け取りました。
I Launched a Next.js Blog in 21 Languages. Here’s What 439 Google Impressions Actually Told Me
In its first week, my 21-language Next.js blog recorded 439 Google impressions and 5 clicks. Later, 436 of 471 pages were indexed. The useful lesson was learning to separate visibility, indexing, and actual search performance.
JavaScript歴6年で参加したMoscowJS 65：それでもローカルミートアップに行く理由
2025年6月5日、T Bankで開催されたMoscowJS 65に参加しました。4つの発表はAIを異なる角度から扱っていましたが、いちばん大きな気づきはもっとシンプルでした。ローカルミートアップには、ドキュメントや録画だけでは完全には置き換えられない価値があります。