TL;DR
- Svelteを勉強し始めて2か月で完成
- フロント・バック・DBそれぞれの専用マネージドサービス無料枠のツギハギで完成まで漕ぎ着く
- 競合サイトのおんJとエッヂ掲示板の劣化版になり無事死亡
- 公開後1時間でおんJ民に飽きられる
ワイは野球に興味ない系のおんJ民やで
Qittaに初めて顔出すんでお手柔らかに頼むで~
ワイのスペック
- 無収入ニート
- 独学でプログラミングを勉強中
- 無料のChatGPT愛用
完成したもの
アプリURL:https://unj-i1v.pages.dev/
ソースコード(AGPL):https://github.com/onjmin/unj/tree/main
後の章で追って解説するやで~
見た目
エントリページ
スレッド一覧ページ
スレッド個別ページ
計画の軌跡
- 2月3日 初コミット
- 2月12日 最初のモック作成
- 3月2日 モックと
Glitch
の疎通完了 - 3月10日 モックと
Glitch
とNeon PostgreSQL
の疎通完了 - 3月29日 一般公開
まともなスケジュールを立てず3月29日一般公開
という線だけ引いて頑張ったやで
無計画ニートだからこそ成せる技やな
成功した部分
無料でサービスが作れるとは思わんかったけど何とかなったわ
構成図
- フロント:
Cloudflare Pages
- 静的サイトをホスティングできる無料サービスやで
- バック:
Glitch
- Node.jsのプロセスの稼働時間に制約がない、パワフルな無料サービスやで
- DB:
Neon PostgreSQL
- PostgreSQL単体が使える無料マネージドサービスやで
分散されたフロントサーバーから中央集権的に1つのGlitch
にアクセスする構成やで
フロントのURLにDDoSされても無傷な構成になっているんや(俗にいう避難所やな)
もちろん開発者ツールのNetworkを見られるとバックのURLがバレるんやが
少なくとも機械的なDDoS相手には耐性がありそうな構成やと思っとる
(Pipedream
は無料枠が渋すぎて疎通させてないやで)
失敗した部分
競合サイトの劣化版になったこと
- おんJ
- アプリURL:https://hayabusa.open2ch.net/livejupiter/
- オープンソース?:https://github.com/satorunet/open2ch/
- CGIとAjaxとSocket.IOを組み合わせた掲示板
- エッヂ掲示板
- アプリURL:https://bbs.eddibb.cc/liveedge/
- オープンソース:https://github.com/edginer/eddiner
- エッジコンピューティング技術を使った掲示板(Rust製)
実際にアクセスすると分かるんやが、スレの読み込みに決定的な差が出とる…
ユーザーにもしっかり指摘されてるで
分析
- おんJ
- CGIなので初動は爆速
- エッヂ掲示板
-
Cloudflare Workers
を使っており、典型的なアーキテクチャのバックエンドに相当する部分がなく爆速
-
- ワイの掲示板
-
Cloudflare Pages
は高速で疎通 -
Neon PostgreSQL
も高速で疎通 -
Glitch
がボトルネックになっている
-
ワイの掲示板も開発環境なら高速(1秒弱)で描画できるんやが、
本番環境(Glitch
)やと(2~3秒)かかってしまっとる…
CGI、エッジコンピューティングどっちもつかずのアーキテクチャだから負けてしまったんや…
ちなワイがGlitch
を間に挟んだ理由
- DBのアクセス回数を減らす(サーバー上の変数にキャッシュする)
- JWT認証を採用しているので、JWT失効用に中央集権でアクセス制御したい
- Socket.IOでリアルタイム更新したい(
Cloudflare Workers
は力不足)
これらの要件は個人運営サービスやとやや過剰品質だったかもしれん…
ユーザーの人数なんて知れてるからキャッシュ層なんて要らなかったかもしれん
無料枠で完結すると限界があるんかなあ
ここはもう少し拘ればユーザーのウケが良かったかもしれんわ…
最初の利用規約要らなくね?
明らかに新規ユーザー獲得の弊害になっとる…
ただ、「みなし同意」は法的によくなく、
一方で、匿名掲示板というテイでIPアドレス等を記録しないのも法的機関の要請に応えられなくなってしまう
開示請求に応じられないと最悪運営の責任が問われる可能性があるんやで
法的根拠
- 刑事訴訟法
- 電気通信事業法
- プロバイダ責任制限法
サービス運営する上でこういった暗黙的な努力義務の板挟みになって
ユーザー体験最悪なモンができてしまったんや…
ユーザー体験最悪やけど誰か使ってクレメンス
まとめ
今回はTL;DRの解説に留めて、
詳細な実装を含む技術的な解説は飛ばしたわ
その辺はREADMEに書いてるので暇があったら読んでクレメンス
ソースコード(AGPL):https://github.com/onjmin/unj/tree/main
コントリビュートも受け付けてるやで~
ほな、また……