URLアドレスバーでスネーク！まさかの場所で遊べる超ミニマルゲーム！
引用元：https://news.ycombinator.com/item?id=45408021
俺も昔ファビコンで似たようなやつ作ったんだぜ。これ見て！https://franciscouzo.github.io/favisnake/
俺もだよ！ファビコンで2048を何年も前に作ったんだ。これ見てくれよな！https://aquova.net/games/2048/
みんな、君らはレジェンドだよ。スネークゲームにとって、これ以上小さい場所って多分ないよね。
これ、意外と遊べるんだよな！俺1500点まで行ったぜ。
これ大好き！2144点取ったよ。色のリファレンスがあるといいかもね、でも必須じゃないよ。
Safariだとファビコンが更新されないみたい、悲しい！
うわー、これ素敵だね。Retinaだとプレイしづらくなるな:D
追記: ゲームオーバーエフェクトがすごい！
すごいアイデアだね。でも食べ物が見えないんだけど。
君が食べ物を見つけられなくても許されるよ。だって、たった一つのちっちゃな食用ピクセルなんだからね。
このゲームマジ最高！でもホワイトスペースがブラウザで表示崩れるのが気になるな。全部の点字パターン使って、背景を⣿にして蛇とか餌をネガティブスペースにすれば、文字間隔も均一になるし、読みやすいんじゃね？
このアイデアどうよ？
あー、その点字のアイデアは俺も考えたんだよね。序盤はいいけど、後半で蛇がデカくなると、変なホワイトスペース代替文字が増えまくって動きがガタガタになるんだよな。
集中して高スコア狙ってる時にカクカクするのは最悪じゃん？「？」ボタン押してURLをページに表示するのが今はベストかも。
Redditのこれみたいなのは嫌だけどな: https://old.reddit.com/r/webdev/comments/1n9z77e/snake_in_th…
あと、途中で色を反転させるのもアリかもな。
これ、マジでレスポンス良くてビビったわ！「戻る」押したらすぐにHNに戻れるし、履歴が汚れないの最高じゃん！
天才的なアイデアだよ、これ！
history.pushStateとhistory.replaceStateの違いだな。
この2つのAPI、セッション履歴は操作するけど、履歴タブに出るグローバル履歴とは別物なんだよな。
ほとんどのブラウザはどっち使ってもグローバル履歴に記録するんだって。HTML Specにもグローバル履歴の挙動は書いてない。
Vercel Domainsみたいにキー入力で履歴が埋まるのはマジ勘弁！デバウンスして履歴を散らかさないでほしいぜ。
HTML Spec: https://html.spec.whatwg.org/#navigation-and-session-history
Vercel Domains: https://vercel.com/domains
フィードバックありがとうな！Vercel domainで使ってるnuqsの作者だけど（俺が作った！）、履歴が埋まるのが良くないってのは俺も同意だぜ。
履歴エントリ作らずにURLを更新する方法とか、最新のエントリを前のやつにまとめるようにブラウザに頼む方法ってないのかな？
nuqs: https://nuqs.dev
あー、どのブラウザでも使える方法はないみたいだな。13年前からBugzillaで報告されてるけど、まだ解決してないんだよ。
グローバル履歴の仕様がないし、今後もできそうにないから、結局デバウンスするのが一番現実的な解決策だぜ。Googleマップもそうしてるらしいぞ！
Bugzilla: https://bugzilla.mozilla.org/show_bug.cgi?id=753264
ソースコード見ると、URL更新にレート制限かけるブラウザだと、バックボタンが使えなくなる別のやり方を使わざるを得ないらしいぞ。
これがdrawWorld関数だぜ。
URLハッシュ作って、ホワイトスペース文字を置換して、history.replaceStateを使ってる。
もしhistory.replaceStateがスロットリングされたら、location.hashにフォールバックするけど、そうするとバックボタンを乗っ取っちゃうんだよな。
警告だ！もしブラウザの履歴を普段使ってるなら、このゲームはシークレットモードとかで遊んだ方がいいぞ。
教えてくれてありがとう！ちょうど過去1時間分の履歴を消したよ、それもアリだね（でもシークレットモードの方が絶対いいけど）。
なんて気の利いたアイデアなんだ、笑。URLを点字パターンで更新してるってわけね。最高だ！
https://github.com/epidemian/snake/blob/master/snake.js
ハハ、これ僕らが作ってるブラウザに組み込むべきだね！
https://github.com/browseros-ai/BrowserOS
めっちゃクール！昔Tandy Pocket Computerで似たようなSnakeゲームを作ったことあるんだ。Zorkの20部屋分のサブセットも作ったっけ。必死にゲームを圧縮してた、めっちゃ原始的な時代だったよ。
https://en.wikipedia.org/wiki/Tandy_Pocket_Computer
これ作った人、信じられないくらい独創的だね。目疲れはするけど、この発想にはマジ感動！最高だ。ところでちょっと提案なんだけど、ヘビが画面外に出てもループバックするようにしたら、もっと遊びやすくなるかも。応答性の問題も補えるし、自分を食べちゃったらゲームオーバーでいいんじゃないかな。
お前のブラウザの履歴ログに合掌！
Firefoxなら「履歴」→「Snakeゲーム」→「このサイトを削除」ってやれば大丈夫だよ。
待って、これってどのウェブサイトでも俺のブラウザ履歴をめちゃくちゃにできるってこと？（AdTechにとってはチャンスを逃した感じか？）
そうだよ。「ruin my search history」とかで検索してみてごらん。怪しい検索履歴で埋め尽くされるから。
広告がブラウザの履歴を悪用してたって話、昔からあったよね。
もっとコメントを表示（1）
普通の人には何でもないかもだけど、これはマジでヤバい！どうやったらこんなの思いつくんだろ…？
これぞ人間が作り出した知恵だね。
だから俺、Hacker News見てんだよな。マジで良い一日になった！
23点取ったけど、途中で気が散っちゃった！
最初どうやるか分からなかった人へ。左上の水色の「？」マークにやり方が書いてあるよ。
＞URL上でヘビを矢印キーかWASDで操作して。URLが見えない、変なスラッシュでぐちゃぐちゃならここをクリック。
あと、アドレスバーが十分長いブラウザウィンドウが必要だよ。コンセプト最高、ちゃんと動くね！
demian.ferrei.ro/snake#|%E2%96%91%E2%96%91%E2%96%91%E2%96%91%E2%A0%88%E2%96%91%E2%96%91%E2%A0%A4%E2%A0%A4%E2%96%91%E2%96%91%E2%96%91%E2%96%91%E2%96%91%E2%96%91%E2%96%91%E2%96%91%E2%96%91%E2%96%91%E2%96%91|[score:0]
Firefoxだとプレイしにくいな、混乱するよ。
バージョン143ならちゃんと動いたよ。
Androidだと（同じバージョンでも）ダメだったな。
あぁ、ごめんね。元々はモバイルブラウザでも結構動いてたんだ。もしモバイル端末で挑戦するなら、「？」をクリックするとページから離れずに現在のURLが見れるよ。操作はぎこちないけど、ハイスコアを友達と共有できる報酬があるよ！:P
めちゃくちゃユニークで革新的なアイデアだね。うまい！
なんてこった、これ最高じゃん！うまいこと言ったつもり（Pun intended）。
予想より難しいね。ヘビの周りの余分な空白の点がちょっと邪魔。あれがないとどうなるんだろ？
昔はこんな感じだったんだよ、ブラウザがセキュリティとか言って俺たちの楽しみを奪う前はね。URL: https://raw.githubusercontent.com/epidemian/snake/refs/heads…
最高だね。こんな変わった方法でインタラクティブなものを作るクリエイティブな人たち、大好き。まさにHacker Spiritだ。よくやった！
めちゃくちゃ面白いね。何がきっかけでこれを作ったの？その話、聞かせてほしいな。
「何がきっかけでこれを作ったの？」
実は覚えてないんだ！ごめん、もうずいぶん前だから（10年前か…）。多分、Brailleシステムについて考えてたのがきっかけだと思う。Brailleが2x4グリッドで256値を表現できて、Unicodeがそれをエンコードしてるって分かって、これで何ができるか考えたんだ。Snakeゲームはぴったりだったね。URLでレンダリングするアイデアはどこから来たか、マジで覚えてない。多分誰かのアイデアをパクったのかも？Lifeゲームも作ったけど、Snakeほど面白くなかったな。URLife: https://github.com/epidemian/URLife
Life-like cellular automaton: https://en.wikipedia.org/wiki/Life-like_cellular_automaton
あまりにもバカバカしくて、思わず笑っちゃったよ。これ、めちゃくちゃクールだね。
音声コマンドで遊べるSnakeゲームを探してるんだ。
俺も昔、これでFlappy Birdを作ろうとしたんだけど、Androidの遅延のせいで無理だったんだ。素早いフィードバックが必要だからね。だから、キャラが床を走って障害物を飛び越えるだけのサイドスクロールゲームにしたら、もっと遊べるようになったよ！
DuolingoとSnakeがコラボしたらどうなるの？
次はDOOMを頼むよ :)
実はファビコンにDOOMをレンダリングするって考えたことあるんだ。できない理由はないと思うな。たぶん@Franciscouzoがその挑戦に取り組めるんじゃないかな！
URL: https://news.ycombinator.com/item?id=45408825
これ、もう存在してるはずだよ。
URL: https://vidferris.github.io/FaviconDoom/favicondoom.html
ffmpeg
ChatGPTにはこれを発明できないだろうね :-) 。この創造性には本当に感動するよ。
最高の日になったよ。こんなことが可能だなんて知らなかったな。
気を付けてね、モバイルブラウザだとこれ、うまく動かないみたいだよ。まあ、予想通りかもしれないけどね。
適切なブラウザやOSの組み合わせがない人向けのデモってどこかにある？
追記：URL: https://raw.githubusercontent.com/epidemian/snake/refs/heads…
モバイルじゃダメだよ。
これ、めっちゃクリエイティブだね！よくできてるわ。しかも驚くほど速いし。
もっとコメントを表示（2）
アドレスしか見えないんだけど？iOSのSafariで見てるよ。
よく見てごらん、アドレスバーにSnakeがいるはずだよ。矢印キーを使うと動くから。
iOSのSafariでは、やっぱり何も見えないね。MacOSのSafariだとゲームは見えるんだけど、どうやって遊ぶか全然わからないんだ。何をしても、左からSnakeが出てきて0点にリセットされちゃうみたいなんだけど？
めっちゃ賢いし、ちゃんと遊べるね！ありがとう。
HAHAHA まじかよ、これAwesome！
これ楽しいね！
10点満点！
すごくクールだね、ソースコードが見てみたいな。ちなみに、どんなAIもこれを再現できなかったらしいよ。
ソースコードはミニファイとかされてないから、Ctrl+Uで簡単に見れるよ。AIの主張については、どうかな。このゲームは10年くらい前からあるから、AIの学習データに入ってる可能性は高いね。ボットは再現できるかもしれないけど、楽しむことはできないだろうね！（少なくとも今のところは）
ページのいちばん下に”コード”へのリンクがあるよ。
うわー、次はDoomを作って！
Doomじゃないけど、3Dの世界を歩けるよ。ここのサイトを見てみて！
https://matthew.rayfield.world/articles/games-and-graphics-i…
これまでに見た中で一番ヤバいものだよ。
ありがとう、今まで読んだ中で最高の褒め言葉だよ :D
これ、すごいね！
次はマルチプレイヤーにして！
あと、ブロックチェーンもね！
それから、AIスネークも！
これめちゃくちゃクールだよ！レンダリングや動きの仕組みを理解するのに少し時間かかったけど、それからは楽しかったよ。
いいね、楽しんだよ。
遊び方理解するのに時間かかったけど、マジで凄いねこれ！ナイス！
兄貴、このゲームは超激しいぜ！
…DOOMを移植する時が来たか？
わお！僕の古いプロジェクトがHNのトップページに載ってるなんて驚きだよ！
もしプレイ中に問題があるなら、たぶん10年前のブラウザで遊ぶように作ったからだよ。昔のゲームプレイはここを見てね：https://github.com/epidemian/snake/blob/master/gameplay.gif?…
その後、ブラウザの”セキュリティ”改善でアドレスバーゲームの機能がかなり制限されたんだ。Chromeのhistory.replaceState()のレート制限とか、空白文字のエスケープとかね。Firefoxもそう。だから色々ひどいハックを使って空白の点字文字を別の文字で置き換えたりしたよ。Safariでは多分ちゃんと動かなかったと思う。こんなハックの山が完全にダメになった時のために、本来のURLをページコンテンツに表示する方法も加えたんだ。ブログ記事を書くべきかな。プレイしてくれてありがとう！
https://github.com/epidemian/snake/blob/master/gameplay.gif?…こっちの方がずっと良い見た目だね。アドレスバーが白黒のピクセル化されたブロック文字（U+2591 light shade）で埋め尽くされてる。でも、それでもまだ動くんだね。
これ、めちゃくちゃクールだね。今まで見た中で二番目にひどいブラウザの悪用だよ ;) 脱帽だ！
このゲームを作ることで、作った人にとっての学習経験は役立つ。スキルを磨くことも役立つ。休憩も役立つ。作り方を見て学ぶことも役立つ。世界飢餓は解決しないけど、一部の人には確かに役立つことなんだよ。
君がここで取り組んでるのは、すごく役立つことだね。
