※この記事はKANGENの梅干しとにらめっこがお送りします。
※この記事は、約3分で読むことができます_(:3 」∠ )_
はじめに
とある勉強会にて 「Web Speed Hackathon2025」 というものが開催されると聞きつけ、(現場のソースコードの速度改善もしたかったので)勉強も兼ねて攻撃力0の状態で参加→ボロボロになったお話です。
この記事の対象者
- Web Speed Hackathonを初めて聞いた方。参加したことがない方。
-
悲しいですがこの記事から表示速度改善に関する知見は得られません。
他にできる学生や一般の方がたくさんいるので、そちらを検索してください
_(:3 」∠ )_パタッ
Web Speed Hackathonってなに?
サイバーエージェントさんが採用イベントも兼ねて2日間にわたり開催している大会です。
ホームページや動画サイトの課題ソースコードを、Gitで取り込みいかに速度を改善したかを点数化し、競い合う大会です(詳細は参考サイトをどうぞ)
応募枠は「学生枠」「一般枠」の2種類があります。審査やランキングは両方混合で競い合います。
もし受けたくなったら?
・学生さんの場合 → サイバーエージェントさんのホームページから参加登録
・一般の方の場合 → connpassというサイトから参加登録
※オンラインもしくは現地参加ができます(現地枠は抽選で決定)
ちなみに、今年は「ある動画サイトの改善」がテーマでした。
ご参考:Web Speed Hackathon 2025
⇧参加資格等もこちらをご参照ください。
感想
- 採点できる環境構築がわからない!
- こちらについては、よく見るとREADMEファイルに懇切丁寧に書いてありました(運営の皆様ありがとうございます!)
- 公式のソースコードを自身のGitにコピー→ローカル環境へclone→ブランチ作成→PRを作成(作成すると、公式のツールでデプロイ環境ができる)→デプロイ環境のurlを公式のissueに登録という流れでした
- こんなに作りこんだ課題で競技するのか!という興奮(ソース自体がすごい勉強になる)
- 本当に画面描画から何もかもが遅い!逆にすごい!
- 解き始める → 、、、あれ?何もわからないぞ。。。(焦り)
- TypeScriptの構文云々ではなく、何が処理を重くしているのかがわからない状況。調べながら修正しても、なかなかスコアが上がらない
- 終盤 → 学生がほぼ上位にいるんだが、学生たち凄すぎないか?!
- 常時 → 運営の方々が優しい。質問したらすぐ答えてくれる!
- 終了後 → レギュレーションチェックで1位以外いなかった。。そんなこともあるの?
レギュレーションチェックとは?
禁止の項目に該当した、テストが通らなかった、修正の段階でバグを作ってしまった等によって、審査対象外になってしまうようです。
(レギュレーションチェックに引っかかった=ずるでは決してないです!)
大会後の運営の方による問題の解説など、本当に勉強になりました!参加して良かった!
結果
1200満点中2桁のスコアでした_(:3 」∠ )_パタッ
3桁出している方に尊敬の念しか出てこなかった。
ひどい点なのに記事にした理由
正直ものすごい恥ずかしいのですが、来年に向けて一念発起するために恥をさらしてみました。
来年はしっかり準備して臨みます!
受けるにあたって最低限必要な知識やツール
気になった方へ必要そうなものを。。
- Githubのアカウント
- Gitを使用するための知識
- TypeScriptの書き方
- Discoad
- 当日installが必要なものは、公式が早めに共有してくれました
試合するために準備したらよいこと
- (一番大事) 歴戦の猛者達がたくさん記事を上げているので、そちらを参考にしてください_(:3 」∠ )_
- 速度改善の基礎の勉強に良いと聞き、購入した本
⇒「Webフロントエンドハイパフォーマンスチューニング」 - 過去の出題を解いてみるのもありかと!
最後に
最後までご覧頂きありがとうございました!
ボロボロでしたが、参加したことは後悔していません。
今回1位の方は本当におめでとうございます!
大会の運営の方々も本当にお世話になりました!
来年は、きちんと勉強して臨みたいと思います!
次はもっと点とるぞ! Web Speed Hackathon2026!!
以上、梅干しとにらめっこでした。