フロントなにもわからないおじさんのHono入門（Concepts）

Motivation

ChatGPT3.5くんのまとめ

要点を箇条書きでまとめると以下の通りです：

• 最初は、Cloudflare Workers上でウェブアプリケーションを作成したかった。
• Cloudflare Workersで動作する良いフレームワークがなかったため、Honoの開発を開始し、Trie木を使用したルーターの構築方法を学ぶ良い機会と考えた。
• 友人が超高速なルーター「RegExpRouter」を持ち込んできた。また、Basic認証ミドルウェアを作成した友人もいた。
• Web標準APIのみを使用することで、DenoやBunで動作可能になった。ExpressがBunで動作するようになったが、「Bun用のExpressはない？」と問われた際に、「いいえ、しかしHonoがある」と答えることができる。
• GraphQLサーバー、Firebase認証、Sentryミドルウェアを提供する友人もいる。また、Node.jsアダプターもある。
• 言い換えれば、Honoは非常に高速であり、多くのことが可能であり、どこでも動作する。HonoがWeb標準のスタンダードになる可能性がある。

Routers

ChatGPT3.5くんのまとめ

RegExpRouter

• RegExpRouterはJavaScriptの中で最速のルーター。
• Expressのような実装ではなく、線形ループを使用している。
• 全てのルートに対して正規表現のマッチングが行われ、ルートが増えるとパフォーマンスが低下。
• HonoのRegExpRouterはルートパターンを1つの大きな正規表現に変換し、1回のマッチングで結果を得る。
• ほとんどの場合、radix-treeなどのツリーベースのアルゴリズムよりも高速。

TrieRouter

• TrieRouterはTrie木アルゴリズムを使用するルーターである。
• RegExpRouterと同様に、線形ループを使用しない。
• このルーターはRegExpRouterほど速くはないが、Expressルーターよりもはるかに速い。
• RegExpRouterがサポートしていないすべてのパターンをTrieRouterはサポートしている。

SmartRouter

• RegExpRouterはすべてのルーティングパターンをサポートしていない。そのため、通常はすべてのパターンをサポートする別のルーターと組み合わせて使用される。
• SmartRouterは、登録されたルーターから推論して最適なルーターを選択する。HonoはSmartRouterとデフォルトで2つのルーターを使用する。
• アプリケーションが開始されると、SmartRouterはルーティングに基づいて最速のルーターを検出し、それを継続して使用する。

LinearRouter

• RegExpRouterは高速だが、ルート登録の段階が若干遅い場合がある。したがって、リクエストごとに初期化される環境には適していない。
• LinearRouterは「ワンショット」の状況に最適化されている。ルート登録はRegExpRouterよりもかなり高速であり、文字列のコンパイルを行わずにルートを追加するため、線形的なアプローチを取っている。
• ベンチマークの結果では、ルート登録の段階も含まれている。
• Fastly Computeのような状況では、hono/quickプリセットを使用してLinearRouterを使用する方が良い。

PatternRouter

• PatternRouterは、Honoのルーターの中で最も小さい。
• Honoはすでにコンパクトだが、リソースが限られた環境向けにさらに小さくする必要がある場合は、PatternRouterを使用できる。
• PatternRouterのみを使用するアプリケーションは、サイズが15KB未満である。

Benchmarks

ChatGPT3.5くんのまとめ

• ベンチマークはただのベンチマークですが、我々にとっては重要です。
• ルーターの速度を測定しました。例えば、find-my-wayはFastify内で使用される非常に高速なルーターです。
• 実際の世界で使用されるルーティングに類似したルーティングを各ルーターに登録しました。
• 次に、リクエストをエンドポイントに送信しました。
• Node.js上の結果と、Bun上の結果、Cloudflare Workers上の結果が示されています。
• HonoはCloudflare Workersで最速であり、Denoでも最速であることが示されています。
• Bunでは、Honoが最速のフレームワークの1つであることが示されています。

Web Standard

ChatGPT3.5くんのまとめ

• HonoはFetchなどのWeb標準APIのみを使用します。これらはもともとfetch関数で使用され、HTTPリクエストとレスポンスを処理する基本的なオブジェクトから成り立っています。RequestsやResponsesのほか、URL、URLSearchParams、Headersなどが含まれます。
• Cloudflare Workers、Deno、Bunもまた、Web標準APIをベースに構築されています。例えば、"Hello World"を返すサーバーは以下のように書くことができます。これはCloudflare WorkersやBunで実行可能です。
• HonoはWeb標準APIのみを使用しており、これはHonoがそれらをサポートする任意のランタイム上で実行可能であることを意味します。また、Node.jsのアダプターもあります。
• HonoはCloudflare Workers、Deno、Bun、Fastly Compute、AWS Lambda、Node.js、Vercelなどのランタイムで動作します。Netlifyや他のプラットフォームでも動作します。同じコードがすべてのプラットフォームで実行されます。
• Cloudflare Workers、Deno、Shopifyなどは、Web標準APIを使用して「Web間の相互運用性」を実現する可能性について議論するためにWinterCGを立ち上げました。Honoは彼らの取り組みに続き、Web標準の標準化を目指します。

Middleware

ChatGPT3.5くんのまとめ

• 「Middleware（ミドルウェア）」は、Responseを返すプリミティブを「Handler（ハンドラー）」と呼びます。ミドルウェアはHandlerの前後で実行され、RequestとResponseを処理します。これはまるで玉ねぎのような構造です。
• 例えば、「X-Response-Time」ヘッダーを追加するミドルウェアを次のように書くことができます。
• このシンプルな方法で、独自のカスタムミドルウェアを書くことができ、組み込みのミドルウェアやサードパーティーのミドルウェアを使用することができます。

Developer Experience

ChatGPT3.5くんのまとめ

• 開発者体験は、優れたアプリケーションを作成するために重要です。
• 幸いなことに、Cloudflare Workers、Deno、およびBun向けのアプリケーションは、JavaScriptにトランスパイルする必要なくTypeScriptで記述できます。
• HonoはTypeScriptで書かれており、アプリケーションをタイプセーフにすることができます。

Hono Stacks

ChatGPT3.5くんのまとめ

• Hono Stacksは、簡単なことを簡単に、難しいことも簡単に行えます。JSONを返すだけでなく、REST APIサーバーやクライアントを含むフルスタックアプリケーションの構築にも適しています。
• HonoのRPC機能を使用すると、API仕様をほとんど変更せずにコードを共有できます。hcによって生成されたクライアントは仕様を読み取り、エンドポイントの型安全性を確保します。
• Hono、Zod、Zod Validator Middleware、hcのライブラリがこれを実現します。
• ミドルウェアやZodを使用して、エンドポイントのパスやリクエストのタイプを提案することができます。
• API仕様の共有により、サーバーサイドの変更に気づくことができます。
• Reactを使用してCloudflare Pagesでアプリケーションを作成できます。 APIサーバーは、Cloudflare PagesでReactを使用して作成できます。
• ReactとReact Queryを使用したクライアントも可能です。これにより、APIサーバーとの通信が簡単になります。

フロントなにもわからないおじさんのHono入門（導入編）

導入メモ

仕事でほぼほぼバックエンドしか書いてなくて、次のプロジェクトも半年くらいバックエンドしか書かないことが確定したのでフロントエンドが書けないため勉強したいと思います。

なぜHono

ぱっとみわかりやすそう（おじさんには重要）でそんなにむずかしくなさそう（おじさんには重要） あと和田さんははるかむかしruby書いてたころよく記事を参考にさせてもらっていたので。

やりかた

公式を一通りやってみる

Hono - Ultrafast web framework for the Edges

環境

Cloudflareは当然なのとしてBun推しっぽいですが、Bunのwindows対応は4/1ぽいので、それまではおじさんのパソコンに最初から入ってたNodejs（v20）でやってみる。

BunのWindows対応は4/1にリリース予定 "Bun 1.1: Bundows is here - YouTube" https://t.co/DWjTAJuxGM

— azu (@azu_re) March 23, 2024

2023/03/26 めも

• チルなタスク管理アプリ『Chill Pulse』Steam向けに発表。Lo-Fiな音楽を流しながら、ToDoリストを作成 - AUTOMATON
• WindowsノートPCのクソデカACアダプタと決別できる謎USBケーブル | ギズモード・ジャパン
• TBSラジオ　2024年春の新番組 | TBSラジオ

---

• Reactを使ってプロダクト開発している開発者だけでなく、マネージャにも読んでほしい「Fluent React」 - ROUTE06 Tech Blog
• 100秒で理解するESM（ESModules）
• Chromium にコントリビュートするための周辺知識 | blog.jxck.io
• Reactを学習できるサービスmosya Reactの技術的な紹介
• 静的サイトはなぜ S3 + CloudFront構成でホスティングするのか

GPT3.5くんと学ぶはじめてのTypeScript：constとreadonly

USER

typescriptのconstとreadonlyの違いを教えてください どちらも代入できないと理解しているのですが。。。

ASSISTANT

TypeScriptにおけるconstとreadonlyは、両方とも変数やプロパティの再代入を防ぐための方法ですが、使用される文脈や適用される場所が異なります。

1. const:
   • constは、変数宣言時に使用されます。constで宣言された変数は再代入できません。ただし、オブジェクトや配列などの参照型については、その参照自体は不変ですが、参照先のプロパティや要素は変更できます。
   • constはブロックスコープを持ちます。つまり、ブロック内でのみ有効です。

const x = 10;
x = 20; // エラー: 再代入不可

const obj = { name: "Alice" };
obj.name = "Bob"; // 可能
obj = { name: "Charlie" }; // エラー: 再代入不可

1. readonly:
   • readonlyは、インターフェースのプロパティまたはクラスのプロパティの宣言時に使用されます。これにより、そのプロパティは読み取り専用になります。
   • readonlyは、再代入を防ぐだけでなく、そのプロパティが宣言された時点から変更できなくなります。

interface Person {
  readonly name: string;
}

let person: Person = { name: "Alice" };
person.name = "Bob"; // エラー: 読み取り専用のため変更不可

要するに、constは変数の再代入を防ぐのに対して、readonlyはプロパティの再代入を防ぎます。また、constは変数宣言で使用され、readonlyはプロパティ宣言で使用されます。

USER

説明はわかりました では以下はどういうことでしょう？

const numbers: readonly number[] = [1, 2, 3];

ASSISTANT

このコードは、numbersという配列を定義し、その配列の要素が読み取り専用であることを示しています。

const numbers: readonly number[] = [1, 2, 3];

これは、numbersという配列があり、その要素の型がnumberであることを示しています。また、readonlyキーワードが配列の前に置かれており、これにより配列の要素が読み取り専用になります。

このように宣言された配列は、要素を追加、削除、または変更することができません。これは、配列自体はconstキーワードで宣言されているため、再代入ができないこととは異なります。readonlyは配列の要素が変更不可であることを示しています。

例えば、以下のようなコードはエラーとなります。

numbers.push(4); // エラー: 読み取り専用のため変更不可

このように、readonlyを使うことで、不用意な要素の変更や削除を防ぐことができます。

USER

ということは、constだけだとnumbers変数自体に再代入はできないが、要素自体には変更できるということですか？

ASSISTANT

はい、その通りです。

const numbers: number[] = [1, 2, 3];

この場合、numbers配列自体はconstで宣言されているので、再代入はできません。しかし、配列の要素である数値は変更できます。

numbers.push(4); // 可能
numbers[0] = 5; // 可能

このように、constキーワードは変数の再代入を防ぎますが、配列やオブジェクトなどの参照型の場合、その中身の要素やプロパティの変更を防ぐことはありません。

一方で、readonlyを使った場合は、配列やオブジェクトの要素やプロパティ自体を変更できなくなります。

USER

ありがとう！よくわかりました

ASSISTANT

どういたしまして！もしご質問がありましたら、いつでもお知らせください。お力になれることがあれば喜んでお手伝いいたします。

---

www.typescriptlang.org

---

constアサーション「as const」 (const assertion)

typescriptbook.jp

オブジェクトリテラルの末尾にas constを記述すればプロパティがreadonlyでリテラルタイプで指定した物と同等の扱いになります。

const pikachu = {
  name: "pikachu",
  no: 25,
  genre: "mouse pokémon",
  height: 0.4,
  weight: 6.0,
} as const;

代入はもちろんできません。

Angularのチュートリアリル戦記その1

やる前に…

VSCodeの設定をやっていく。

VSCodeでプロファイル作成

以下でAngularのプロファイルを作成して拡張を入れておく。

ginzanomama.hatenablog.com

Angular ESLint

以下を読んで脳死でコマンド実行。

qiita.com

zenn.dev

$ npm i -D prettier eslint-plugin-prettier eslint-config-prettier
$ # commit
$ ng add @angular-eslint/schematics 

チュートリアル

ここまできたらapp.component.htmlを全消ししてチュートリアルやっていきましょう！

angular.dev

あとでちゃんと書くAngular17

Angular 17をインストール

Angular 17でstandaloneで開発したい、公式チュートリアルのlocal appだとまだ*ngなんちゃらで古いのでブラウザのほうを実施したいので以下でインストール。

Learn Angular • Angular

npm install -g @angular/cli

npm, npx

以下を読みます。

• 知らないのは損！npmに同梱されているnpxがすごい便利なコマンドだった | DevelopersIO
• npmとnpxの違い説明できますか？ #Node.js - Qiita
• 【npmとnpxの違い】便利なnpxについて理解する | ギークの逆襲 🐟
• npxコマンドを使って、未インストールのコマンドを使った時の挙動を確認する - CLOVER🍀

マイナーアップデート

出始めなので17.0.0 → 17.0.9など細かいアップデートが続く場合のアップデート方法。

ng updateでupdateできるかみてみる。

PS C:\Users\hoge\Documents\Dev\angular> ng update
Using package manager: npm
Found 26 dependencies.
    We analyzed your package.json, there are some packages to update:

      Name                               Version                  Command to update
     --------------------------------------------------------------------------------
      @angular/cli                       17.0.0 -> 17.0.9         ng update @angular/cli
      @angular/core                      17.0.2 -> 17.0.8         ng update @angular/core

    There might be additional packages which don't provide 'ng update' capabilities that are outdated.
    You can update the additional packages by running the update command of your package manager.

みたいな感じで個別にアップデートする必要が出てくるので以下のような感じでアップデートする。

ng update @angular/cli @angular/core

PS C:\Users\hoge\Documents\Dev> ng version

     _                      _                 ____ _     ___
    / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
   / △ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
  / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
 /_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
                |___/
    

Angular CLI: 17.0.9
Node: 20.9.0
Package Manager: npm 10.1.0
OS: win32 x64

Angular: 17.0.8
... animations, common, compiler, compiler-cli, core, forms
... platform-browser, platform-browser-dynamic, router

Package                         Version
---------------------------------------------------------
@angular-devkit/architect       0.1700.9
@angular-devkit/build-angular   17.0.9
@angular-devkit/core            17.0.9
@angular-devkit/schematics      17.0.9
@angular/cli                    17.0.9
@schematics/angular             17.0.9
rxjs                            7.8.1
typescript                      5.2.2
zone.js                         0.14.2

ng serve

ng serve で動作確認する。動いたらここがやっと出発点です。チュートリアルで修行しましょう。

おじさんでもわかる！VSCodeのプロファイル機能の使い方

VSCodeのプロファイルを作りたい

VSCode、業務でずっと使ってますが、おじさんなのでただ使ってるだけでなんもわかってないのですが、いろんなプロジェクトや言語で拡張入れまくってると、拡張がめちゃくちゃ入って気持ち悪いなとずっと思ってんたんですが、プロファイルで切り替えられるそうです！！！

VSCodeの設定の切り替えや共有に便利なプロファイル機能を活用しよう #VSCode - Qiita

早く教えてほしかった…

詳しいことは上の記事みてください。

おじさん用めも

諸事情でAngular使うのが多いのでAngularテンプレートで作成する

4.3. テンプレートをベースにして新規プロファイルを作成する

追加の拡張入れる

• Error Lens
• GitLens
• Import Cost（なくてもいいかな…）
• Auto Rename Tag
• Blockman
• DotENV
• indent-rainbow
• Path Autocomplete
• Pretty TypeScript Errors

setting.jsonいじり

何も考えずctrl + ,でsetting.json開くとデフォルトを開いてしまうのでプロファイルコンテンツの表示からsetting.jsonを選んだほうが確実（これで何度も悩んだおじさん）

アクティブなタブに色を付ける

"workbench.colorCustomizations": {
  "tab.activeBackground": "#fff"
}

制御文字を表示

"editor.renderControlCharacters": true,

なにはともあれ

次は環境作成の予定（Angular + Docker + Visual Studio Code + WSL開発環境構築 #Docker - Qiita）

開発環境作るのが何よりめんどい…

言語単位でいい感じの環境を用意してくれるオンラインサービスないですかね…

Github Codespaceがなんとなくイメージと近いんだけどどのくらいお金かかるか予想がつかないのでいまいち試しづらい…

買ってよかったね2023

お疲れ様です。簡単で失礼します。

EIZO FlexScan EV3895

EIZO FlexScan EV3895-BK （37.5型/3840×1600/ウルトラワイド曲面モニター/アンチグレアIPS/疲れ目軽減/ブラック）

世情に反して諸事業によりほぼほぼフルリモートになりまして、それまではフルHD4枚を100％でみれる43インチモニタという名のテレビを使っていて特に不満はなかったのですが、弊テレビのREGZA 43Z700Xではうっすい青とかグレーとかが白とほぼ同化して見えていたという衝撃の事実がありまして（同僚とのチャットで知った）、仕事に支障がありすぎるので買いました。

死守すべきフルHD4枚を100％でみれる43インチモニタを捨ててまでなぜEV3895を買ったか、その理由はペーパーモードというおじさんの目にやさしい（わかものにもやさしいですよ！）モードがあったからで、多少黄色みがかかるが激烈目にやさしいのでこれにしました。

ほぼ毎日8時間ほど使ってますが眼精疲労もほぼほぼなく、よき～と思いながら使ってます。

あとウルトラワイドモニターどうなんだ説ですが、4Kより500pxほど足りないですが慣れます。要は慣れ。無いものには順応していくしか無い。ただこれに付きます。縦が足りないとソース読むときつらいですが、足りないんだから仕方ない。おじさんになるとその辺寛容になります。

あとこれがいちばん買ってよかった理由、モニタがハブになる！！サンダーボルトで繋げられるんでケーブル抜き差しするだけでキーボードスピーカマウスすべてそのまま社用PCと私用PCで行き来できます！！！これがめちゃ便利で、これなかったらCalDigit TS4買うところだったのですごいうれしいですんで…

CalDigit TS4/ Thunderbolt Station 4-0.8m Thunderbolt 4ケーブル付き [TS4-JP-AMZ]

結論としましては、おじさんはEV3895買ってください（値段のことは忘れてください）

FlexiSpot E7 Pro

www.flexispot.jp

前述しました、ほぼほぼフルリモートになったので前からほしかった電動昇降式デスク買いました。ミーティングの時とか気分を変えたいときとかに上げたり下げたりして遊んでます。

おじさんになるとずっと座ってるのはなかなか腰的にもきびしいところがあるので上げたり下げたりして遊べるのはすごくいいと思います。あと買うならコの字型のほうがいいかもです（足が奥にいくので広々）

耐荷重ですが100kgなのでモニタアーム付けてEV3895吊ってますが余裕で耐えます。なんならおじさんが乗っても大丈夫です。

キミもおじさんと一緒に上げたり下げたりして遊ぼう！いまならセールで安くなってます！（￥61,600→￥46,200）

あとおじさんはもし買うならぜったい組立サービス使ってください。電ドラありでもあれを一人で組み立てるのはきびしいよ！

MYTREX MINI

MYTREX マイトレックス REBIVE MINI 筋膜リリースガン ハンディガン ボディケア フェイスケア 筋肉ほぐし 振動 肩 腰 足 小型 リバイブミニ MT/BY-RBM20B

マッサージガン、ぼくもそんなのいらないと思ってました。

めちゃ極度の肩こりなんですけど、この手の電動マッサージのやつ買ったことあって、まあまあよかったんですけどでかいからじゃまになるし、でかいと例に漏れず重いので肩こり直しながら肩こり製造するみたいな感じになって使うのをやめてました。

そんなときにヨドバシぶらぶらしてたらマッサージガンコーナーがあって、いまのってめちゃ小さくなっててこんなのでイケんのか？って疑心暗鬼になりながら試したら昔のでかいの以上のパワーで叩いてくるのでこいつやるやんけ…と思ったので買いました。テクノロジーの進化のやばさを感じまして、かわりに語彙力を失いました。

この手のマッサージガンってめちゃあって、どれがいいのかわからないおじさんが多いと思います。そんなときは見た目で買うかローラで買うか、この2択でよいと思います。ぼくは米倉涼子よりはローラなのでローラを信じたい、その気持を信じました。

買ってどうだったかですが、ぶっちゃけると対処療法なので完治はしない、これだけおじさんは覚えて帰ってください。やった数時間はすごくよいですが、まあ治らないので医療機関に頼りましょう。ぼくは医療機関に頼りましたが治らないのでローラを信じます。信じる気持ち、信じたい。

2023年の買っていき

諸事情によりほんとはもっと買ってたんですが、おじさんになると3つ以上のものごとを覚えるのがつらくなってくるので3つにしました。

2023年、もう終わりますが、おじさんもわかものも来年はもっと買っていきましょう！！！

ことしもありがとうございました。らいねんもよろしくおねがいします！

---

▶ 【PR】はてなブログ 「AIタイトルアシスト」リリース記念 特別お題キャンペーン

by はてなブログ

買ってよかった2023

テンポラリのエディタをOneNoteにした

はじめに

OneNoteが使いやすいと言ってるわけではなく、弊社がMSにロックインされてるので仕方なく使ってるというのが前提というお話です（ここからのはなしはたぶんnotionとかでもできます）

テンポラリのエディタ

ちょっとしたことをメモっておいたり、ソースをコピペする前にいったん置いておいたりなど、さほど重要でないことを一時的に置いておくところによくエディタを使ってると思うんですが、重要度が低いがゆえに保存することってほとんどなくて、いわゆる書き捨てというか保存せず捨ててしまって、あとからあれ取っとけばよかったあって思うことありませんか？ぼくはめっちゃあります。おじさんになればなるほどよく発生してます。

そんなときのOneNote

OneNote、正直めちゃくちゃ使いづらいんですが、とりあえずここにコピペしておけば勝手に保存されるので消えることがない！正直ただこれのためだけに使ってます。

OneNoteのいいところ

• 自動保存
  • これがいちばんの理由
• だいたいなんでも貼れる
  • EXCELの表とかコピペしてもいい感じでフォーマットを維持したまま貼れる（なんでもいい感じではない）
• URLがいい感じで保管される（Edgeじゃないとだめかも、Chromeはだめだった）
  • タイトル拾ってきてくれる、ココピーとか使わなくて良い
• スクショが貼れる
  • ざつにコピペで貼れる
  • OCRで文字まで検索してはくれなかったような（ざつに貼ってるだけなので検索したことない）
• Webページをコピペすると引用元を入れてくれる
  • 〇〇から引用しましたみたいな文字とコピペ元のURLを貼ってくれる
• 意外にちゃんと検索できる
  • 実用レベルでページをまたいで検索できる

OneNoteのめんどいところ

• ページを作らないといけない
  • ざつに1ページに貼ればよいってのもあるが…
• なぞのブロックみたいのに入力しないといけない
  • エディタのどこからも入力できるが、なぞのブロックが自動で作られてその中に入力しなければならない
  • なぞブロックが最初なんなのか意味がわからなくて混乱したが、なぞブロックはできてしまうものと認識してからは脳死で気にしないようにした
  • まあこれはnotionも似たようなもんですが…
• フォーマットが保存されずコピペされるものがある（Officeでいうところの書式とかそういうやつ）
  • いい感じで色付けされてるコードとかそういうのがすべて黒になる（Excelとかに貼るとちゃんと貼れるやつ）
  • ものによってはSQL貼ったりすると半角スペースがすべて削られて殺したい気持ちになる（書式使わずTEXTで貼ればいける）

おれたちのOneNote

だいたいの会社員の方はOffice365使わされてると思うのでざつに使ってみると思ったよりは使えましたという報告でした（なんせざつに使ってるだけなのでちゃんと調べて対策しようとは思ってない）

こちらからは以上です。

2022年STARDAMざっくりストーリー

12.29両国終わりまして、ざっくりな感想ですが、マッチメイクが唐突なのがあったりと？？なものがありましたが、なにはともあれなんだかんだジュリアの年だったなと思いました。

試合結果は以下を参照ください。

wwr-stardom.com

昨日のマッチメイクに関してですが、ざっくりとした2022年ストーリーを備忘のためまとめました。

ハイスピード選手権試合

AZM：渡辺桃スパナキックで顔面負傷→ハイスピ奪取（キッド）→QQ総選挙（林下詩美）→ハイスピ防衛タイ

清水ひかり：COLOR'Sコズエン対抗戦→COLOR'Sコズエン連合軍→ハイスピ挑戦（唐突）

プレ・トライアングルダービー

向後桃：スターダム参戦→STARS加入→キモオタ→メンバーとギスギス（特に葉月）

羽南：フューチャー最多防衛→フューチャー防衛失敗（壮麗）

岩谷麻優：赤挑戦失敗（朱里）→SWA戴冠（テクラ）→SWA返上→IWGP女子敗退（KAIRI）

葉月、コグマ（FWC）：ゴッデス戴冠→ゴッデス防衛失敗（BLACK DESIRE）→ゴッデス奪還（BLACK DESIRE）→ゴッデス防衛失敗（meltear）

飯田沙耶：復帰→SSS（スーパー・ストロング・スターダム・マシン）

タッグマッチ

ウナギ・サヤカ（ピンクカブキ）：査定→ギャン期（他団体参戦）→ピンクカブキ解散

白川未奈（ピンクカブキ）：COLOR'Sコズエン対抗戦→COLOR'Sコズエン連合軍→コズエンなつぽい加入→中野たむのパートナー問題→白川維新→ワンダー挑戦（上谷沙弥）→ワンダーで顎負傷で離脱→12.29復帰→ピンクカブキ解散（ギャン期なんで私に何も言わないでいなくなった）→Club Venus

テクラ：スターダム参戦（DDM）→SWA戴冠→SWA防衛失敗（岩谷麻優）→欠場→なつぽい脱退涙→復帰

桜井まい：コズエン脱退（DDM）→フューチャー挑戦→ゴッデス挑戦→アーティスト挑戦

ゴッデス・オブ・スターダム選手権　次期挑戦者決定3WAYバトル

ひめか：アーティスト防衛失敗（鹿島沙希＆スターライト・キッド＆渡辺桃）→赤挑戦（朱里）→白挑戦（上谷沙弥）→ゴッデス挑戦権獲得（舞ひめ）

舞華：アーティスト防衛失敗（鹿島沙希＆スターライト・キッド＆渡辺桃）→白挑戦（上谷沙弥）→赤挑戦（朱里）→ゴッデス挑戦権獲得（舞ひめ）

琉悪夏：成長

刀羅ナツコ：復帰

MIRAI：スターダム参戦（DDM）→赤挑戦（朱里）→God's Eye加入→シンデレラ優勝→ゴッデス挑戦

壮麗亜美：スターダム参戦（God's Eye）→ゴッデス挑戦→フューチャー戴冠（羽南）

スペシャル・シングルマッチ

KAIRI：スターダムスポット参戦→IWGP女子初代王者（岩谷麻優）→白挑戦（上谷沙弥）

林下詩美：中野ぅたみ→白挑戦（上谷沙弥）→QQリーダー→赤挑戦（朱里）

アーティスト・オブ・スターダム選手権試合

柊くるみ（プロミネンス）：スターダム参戦→アーティスト奪取

鈴季すず（プロミネンス）：スターダム参戦→ジュリアとのストーリー→アーティスト奪取

世羅りさ（プロミネンス）：スターダム参戦→アーティスト奪取

渡辺桃：スパナ→ゴッデス戴冠（FWC）→ゴッデス防衛失敗（FWC）→アーティスト戴冠（舞ひめぽい）→赤挑戦（朱里）→アーティスト防衛失敗

スターライト・キッド：ハイスピード防衛失敗（AZM）→ゴッデス戴冠（FWC）→ゴッデス防衛失敗（FWC）→アーティスト戴冠（舞ひめぽい）→アーティスト防衛失敗

鹿島沙希：アーティスト戴冠（舞ひめぽい）→アーティスト防衛失敗

ゴッデス・オブ・スターダム選手権試合

優宇：スターダム参戦→ゴッデスリーグ優勝→ゴッデス奪取

高橋奈七永：スターダム参戦→ゴッデスリーグ優勝→ゴッデス奪取

なつぽい：アーティスト防衛失敗（鹿島沙希＆スターライト・キッド＆渡辺桃）→たむちゃん引退するの？→DDM脱退（コズエン）→ゴッデス戴冠（FWC）→meltear→ゴッデス防衛失敗

中野たむ：白挑戦（上谷沙弥）→COLOR'Sコズエン対抗戦→COLOR'Sコズエン連合軍→たむちゃん引退するの？→なつぽい加入→赤挑戦→ゴッデス戴冠（FWC）→meltear→ゴッデス防衛失敗

ワンダー・オブ・スターダム選手権試合

上谷沙弥：ワンダー防衛ロード→KAIRI白いベルトが泣いてる→KAIRI戦延期（かわりにひめか挑戦）→KAIRI戦引き分け→ワンダー防衛

梅咲遥：スターダム参戦→KARMA→ワンダー挑戦（唐突）

ワールド・オブ・スターダム選手権試合

ジュリア：DDM増員→赤挑戦→ゴッデス挑戦→アーティスト挑戦→5 STAR優勝→赤奪取

朱里：赤防衛ロード→DDM脱退→God's Eye結成（MIRAI、壮麗亜美）→God's Eye増員（稲葉ともか、ななみ）→赤防衛失敗

2023年のストーリー

ジュリアの赤防衛ロード、上谷の白最多防衛どうなるかとちゃんみなとのストーリー、7Uppこれからどうするのか、コズエンどうなるのか、など今後もいろいろありそうですね。

それはともかく、1.4のケニーオメガオスプレイ戦がたのしみすぎてやばいです。

こちらからは以上です。