にふうち回避

日々のプログラミング勉強の記録

*自分自身の勉強の備忘録としての記事がほとんどです.内容の正確性などは担保されません.

Kaigi on Rails 2023で初登壇しました #kaigionrails

はじめに

2023年10月27日、28日に開催された「Kaigi on Rails 2023」に参加し、Day2で登壇してきました。 初めての外部カンファレンス登壇だったので、登壇までのあれこれを振り返ろうかと思いブログを書いています。 宜しければお付き合いください。

発表資料

「返金処理を通して学ぶ、カード決済電文の沼バトル」というタイトルで発表しました。

speakerdeck.com

登壇しようと思った最初のきっかけ

そもそものきっかけは、去年現職へ転職後すぐに参加したRubyKaigi2022で自分と同じようなエンジニアになって日の浅い方が複数人登壇されているのを見たことがきっかけでした。kaigieffectですね

RubyKaigiが参加前に感じていたようなハードルの高い場所ではなく、若手・熟練問わずに参加しコミュニティ貢献できる場所であると感じ、「自分もいつかカンファレンスで登壇してコミュニティ貢献がしたい」と帰りの新幹線で強く思ったことを覚えています。

特にフィヨルドブートキャンプ卒業生の方(ふーがさん)は自分とエンジニア歴が近いにも関わらず(勘違いでしたらすみません) 、RBSに関する実践的な内容で登壇をされており「僕も頑張ろう」と思わせてくださる存在でした 。一般参加の卒業生の方も多くいらっしゃり、素敵なコミュニティだな…と感じたことを覚えています。

最後に後押しされたもの

とはいえイマイチ最後の一歩が踏み出せなかったのですが、社内でプロポーザルを出している人が多いこと、「最近やったアレとかいいんじゃない?」と言ってもらえたことが最後の一歩に繋がったな〜と思っています。

勢いで宣言をする僕と参考資料を貼ってくださるohbaryeさん

その後過去に登壇された mitaniさんohbaryeさんのプロポーザル、うなすけさん大倉さんのガイド記事を読み、締め切りギリギリに2本提出し、うち一本が採択されました🎉

社内サーバーサイドエンジニアチーム全体がKaigi on Railsプロポーザル出すぞモードだったことや、壁打ちなどのサポートを受けられたことが何とか提出まで漕ぎ着けれられた要因だと思います。

自分でつけておいて読み上げるのがとても恥ずかしかった

資料作りと練習

資料完成がギリギリ

10月の頭にどのようなことを話すかの壁打ち会を社内で開き、他エンジニアの方からFBをもらいました。 このタイミングで内容は固まっていたのですがなかなか筆が進まず、10月26日の夜にようやく通しの発表練習ができ、資料の完成は27日(Day1)の夜になってしまいました。

10月前半に作り終えて社内でのレビューなどをもっと受けられればよかったな…と反省しています。

発表練習

誰かに聞いてもらう時間もないのでCLOVA Noteという文字起こしアプリを使い、バーっとしゃべったものを原稿に起こし構成しました。 会話駆動台本開発です。

このCLOVA Noteが優れもので、文字起こし精度が高く話しながら再生位置にマーカーを立てられて後からの振り返りが非常にやりやすかったのでおすすめです。

clovanote.line.me

あとは「若手が完全に理解した→何もわからん」の体験談ベースに決済処理の雰囲気・カオスさ・楽しさが伝わることを第一目標に、楽しくフランクな発表にしようとイメージだけ決めて寝ました。

登壇

Day1でオーディエンスとして座ったときはそんなに広さを感じなかったRoomBが、壇上に立つととても広く見えてめちゃくちゃに緊張し、AppleWatchから心拍異常の警告が出ました

ただ参加している弊社エンジニア全員(!!)が応援に来ていただいていたおかげで、何とか倒れずに済んだと思います。優しい先輩たちでよかった…

時間だけはオーバーしないように気をつけながら何とか話し切りました。

(応援で来てくださった先輩を打ち合わせなしにいじってしまったので反省しています。次は自力で笑いを取れるように鍛錬します)

登壇してみて

実際に登壇してみると想像以上に会場・Twitterともに反応してくださる方が多く、ちゃんと沼感がお伝えできていたようで素直に嬉しかったです!

発表後も興味を持って質問してくださる方や、感想をくださる方が何人もいらっしゃり「登壇してよかったー!」と心から思えました。 自分の登壇内容をフックに他の決済絡みのお話を伺えたりして、これは登壇しないと味わえない体験だな…!と思いました。

また懇親会では「自分も若手なので頑張ろうと思えました…!」と言ってくださる方がいらっしゃり、自分が一年前にRubyKaigiで受けたeffectを他の方にもお届けできているのかも…!と思えたことも大きな収穫でした。 感想やFBをくださった皆様、話しかけてくださった皆様ありがとうございました!

最後に

多くの方に支えられて、無事登壇をすることができたKaigi on Railsでした。直接発表のブースや懇親会などでたくさんの方と交流もでき、オフラインでのイベントの良さもしっかり味わうこともでき、充実した2日間でした! 一年越しでようやく登壇を果たせ、少しコミュニティ貢献できたかなと達成感を覚えています。

改めて登壇の機会をくださり、素晴らしい会を開催してくださった運営メンバーの皆様、スポンサーと参加者、登壇者の皆様、本当にありがとうございました!

2022年の目標

初詣
昨年は転職などで多くの方にお世話になり、背中を押していただいた一年でした。

今年は転職先で始まる社会人3年目。

インプットを増やし、自分の活躍で大きくプロダクトに貢献できるようなチャレンジをしていきたいと思っています。

ざっくり挑戦したいこと

  • 引き続きインプットを増やす
  • 先輩からたくさんフィードバックを受ける
  • プロダクトの価値を高められるような貢献をする(「これ俺が作ったんすよ」とドヤれるように挑戦する)
  • 文章をたくさん書く、説明力をあげる

先輩やメンバーからのフィードバックをたくさんいただきながら成長していける一年にしたい。

RubyKaigi~最終日感想~

最終日

error_highlight

感想

  • 何気なく使っていたerror_higlightだが仕組みについて恥ずかしながら考えたこともなかった。かなり泥臭く地道な実装なんだな…
  • エラーメッセージの改修で立ちはだかる壁が脅威対応のためのescape処理になるとは。発表を聞いていなかったら何も考えずに3.2で使っていたと思うが、これからは「このエラーメッセージの裏にも大変な努力が…」と思いながら見れる。
  • 正規表現結構好きだし、しょっちゅうケアレスミスでエラー出しまくるのでなのでエラーメッセージの表示改良と実装に関するコントリビューションとか将来挑戦してみたい

RBS自動生成

感想

  • happy hackingを目指そう
  • 実験的なgemであるからこそか、シンプルで拡張性に富んだ実装ができるように意識されている。実際多くの人に使われて、さまざまなmiddleware実装例が出てきそう

     (黒曜さんの実況ツイートめちゃくちゃ自分のメモで引用させてもらっています……ありがとうございました。)

  • と思っていたが、実はとんでもなく規模がデカく野心的で既に形を成している存在であると後半で気づいた。とにかく触って動かしてみないとイメージは湧かないな

Fiber Scheduler

感想

  • スケーラブルなDNSサーバー作れないというフラストレーションからFiber、Asyncを作り、ストリーミングにも対応しかれた変遷を聞きながら、こういう方々が次の技術を作っていくんだなと改めて実感。Async一つでも、non-blockingにするために細かないところまで対応していて、情熱とモチベーション、余念のなさがすごい。
  • Railsサーバーもかなり高速化できる点、大量のコネクションに対応できるAsync::websocketについて特に興味が湧いた。
  • Fiberに対する予習をしっかりしてから読み直したい
  • 講演後に質問をしたら気さくに答えてくれて、Tシャツももらった。Rubyコミッターはみんな人柄がいい
  • いただいたTシャツ。Rubyが「A Sink(async)」を使っている。  

なんでRubyビルドはこんなに大変なのか?

感想

  • とりあえず次期MacOS13に上げてはいけない。Rubyが動かなくなる。
  • M1Mac+DockerでRails環境構築を最近したのでわかるーと思い続けていた。「何もしていないから壊れた」のは当然で、常に変化に対応するために何かし続けること、そして「なんか壊れました!」という報告をあげることも立派なコミットであることは胸に刻みたい。
  • 初学者がより入りやすい未来(この辺りはWASMでもかなり良くなりそう)を提供できる一助になれるように頑張る

BetterRubocopWold

感想

  • 「Rubyの与えてくれる自由はRubocop越しだと初心者に届いているのか?という疑問」などについては初心者として首を縦に振り続けながら聞いていた。なぜこのルールが必要なのかを考えることも大事だし、所属組織では「コードの本質以外で、かつ人の関わ流部分もあるところで議論したりぶつかったりするのは勿体無いから基本的にはRubocopがOKしていたらよしとしましょう」という文化であると教わってはいるが、おっしゃっているジレンマはとてもうなづけるものだった。
  • その上で「強制レベル.yml」「参考レベル.yml」二本立てにするというアイデアは、ジレンマを解消できる魅力があると感じた。「どれをどっちに?」などの議論が起きるという新たなコストは生じると思うが実験としても楽しそう。
  • Rubocopコミッターitocさんのチャットコメント  

  • 万葉社の新人チュートリアルは勉強する際にとてもとてもお世話になったので、その感謝を直接お伝えできたのも個人的には収穫

おまけ

Ruby Ethereum

感想

  • プロフィール画像はなんで骨折しているんだろう……
  • Ethereumの基本要素をRubyで実装してみたというお話し。
  • 非常に面白そうでワクワクするが、自分のブロックチェーンに対する知識が貧弱すぎて理解ほとんどできていない。
  • Rubyがブロックチェーンサービスも支え始めたら楽しいだろうなと思った

String meets Encoding

感想

  • メソッドの実行内容や測定方法などを丁寧に紐解きながら話してくださっていて、非常にわかりやすかった。サラッと流されてしまうことも多いが、一つ一つ検証再現するように話を進めてくださっていたので入り込めたと思う。
  • Rubyの行っている不要なエンコーディングチェックを部分的に無効化することで速度改善を実現できました、と一言で言われてしまうと良くわからんになっていたと思う。
  • Charactor(文字コード)愛を感じられる内容
  • 部分的にRubyらしさを抑えて高速化する点は二日目のJuliaを使ったJITコンパイラのお話しにも通じる部分を覚えた。このような速度改善の取り組みが各所で進んでいくとRubyの処理速度は改善されていくと思うが、果たしてそれはRubyである必要は…?となりかねない?(今回の話はやや違うが)
  • この実験的改善はGitで確認できる  github.com

Steepはいいぞ(Steep開発者)

Ruby programming with types in action - RubyKaigi 2022

感想

  • 3日間、5sessionとおして聞いてきたRBSトークの締め。Steep開発者によるもの。
  • TSを書いていた自分からするとRubyは自由すぎて、ドメイン知識やRuby経験が少ないとどう書けばいいのかわからない(ここの引数は?何を扱っているmethodなの? など)、と思うところが多々あったのでRBSが広がっていってほしいなという気持ちは強い。Sessionの中で紹介された「union使っておくとcase内で網羅検査して型絞り込みできる」点はめちゃくちゃ魅力的
  • RBS+Steepで提供される、IDEでのエラー表示や補完などはめちゃくちゃいい。YARDで一定カバーできるが、「そこまでするなら型定義ファイルかこう」とも思ってしまうため。
  • とは言え既存コードを全て型チェクしてーとやるのは辛いので、述べられていた通り「自分がフォーカスしたいところから」やっていこう。

Key-note(YJITができるまで)

Stories from developing YJIT - RubyKaigi 2022

感想

  • のっけからわからず、有識者のツイートやチャットをひたすらみ続けることしかできなかった。
  • 途中でそれもなくなり完全にわからなくなってしまった。ただ、言語を開発するということはこういうローレベルなと向き合う事である、という当たり前の事実を再認識させられた

終幕

感想

  • 登壇者、運営のみなさんはじめRubyコミュニティー全体に本当に感謝している。参加して本当によかった。

全体通しての感想はまた後で

RubyKaigi2日目感想

Matz基調講演

  • 話が楽しい
  • クソリプを送りつけてくるやつは気にするな、Rubyは価値を生み出し続けているんだ。Rubyが前へと進み、さらに世界を幸せにしていくには僕たち一人ひとりの貢献が欠かせないんだ、みんなで良くしてゆくんだ という連帯感を生み出した基調講演だったと感じたし、自分もRubyのために小さくてもいいから貢献しようと思えた。

Ruby/Debug

  • ruby/debug - The best investment for your productivity - RubyKaigi 2022
  • とてもデバッグがしやすそう。使いやすくて、ユーザーフレンドリーであると感じた。そこらじゅうにlogとか仕込んでデバッグしてるのでわくわく。コマンドなどの細かい仕様については理解しきれていないのでドキュメントを読みたい。
  • 早く使ってみたいの一言に尽きるなあと、会社のSlackでつぶやいたら先輩がRuby/Debugを導入するPRを即出してくださった……  

追記

スクショで見切れているdocsの情報は古いものであると、_ko1さんご本人からご指摘いただいた。 こちらが正とのこと。 github.com

Rubocop server

Make RuboCop super fast - RubyKaigi 2022

感想

  • 自分のBug-issueに素早く対応してくださったkoicさんの発表ということもあり、個人的に一番楽しみにしていた発表。動作の遅くなりがちなRubocop実行用サーバーを立ち上げ、そこで実行させることではやすくするもの。
  • RubyKaigiドリブンでリリースされていてすぐに試せそう。850倍早い、などすごい数字が続いた
  • ケアレスミスが多い自分にとってRubocopは欠かせない存在。興味を持って聞けたしとても楽しかった。
  • 自分もコントリビュートしたいなと思えた。

追記

  • koicさんの登壇ブログ

koic.hatenablog.com

Ruby高速化のためのメソッド単位で実行できるJITコンパイラ

Method-based JIT compilation by transpiling to Julia - RubyKaigi 2022

感想

  • Rubyの動的性を捨て、Juliaを使って大規模データの処理を高速化するJITコンパイラー。よかったな。Rubyの良さを捨てる諸刃の剣ではあるけど、限定的な条件で使うならめちゃくちゃに早くなるし良さそう
  • 大規模データをRubyだけで高速処理できるようになる未来が来ればPythonの処理速度とも戦える……か?

Ruby3x3の評価検証をしよう

How fast really is Ruby 3.x? - RubyKaigi 2022

感想

  • 本当に3倍早くなったの?という検証。Rubyランタイムを使い倒し、依存しているサービスだからこそできたのだなと思う。
  • 3系からしか使っていないからなんとも言えないが、本当に早くなっているんだな、という感想。そして予想通りPythonには差をつけられている。ここまでシンプルなコードなのに…という気持ち。Pythonはライバルと位置付けられがちなのでここから頑張っていってほしいなぁ…
  • 自分のレベルでは本質的なところは捉えられないが、こう言ったベンチマークテストは大好きなので聴いていて楽しかった。

WireSharkのdissectorをRubyで作っちゃう話

Packet analysis with mruby on Wireshark - dRuby as example - RubyKaigi 2022

感想

  • やっていること自体は素直なバイナリ解析で、内容も理解できる。だけど通信プロトコルに対する興味だけで、mRubyを組み込んだWireSharkをビルドしちゃおう!というとこまで行けるのがすごい
  • 純粋な技術者の興味と好奇心を感じた。ニコ動技術部に似たワクワクを感じる内容でとても楽しかった。

Caching With MessagePack

Caching With MessagePack - RubyKaigi 2022

感想

  • 英語レベルも技術レベルも難しく理解できず…悔しい
  • MassagePackとMarsharlについて知れたから良い

VS World

  • この人たちがRubyを作っているのか……という凄みを感じた。やはりこうしてコミッターの方々を生で見れるのはいい。会場の空気は完全にファンミ。

その他

  • Matzさんとツーショが取れた。「Ruby触り始めてまだ半年なんですけどとても楽しいです!頑張ります」しか緊張して言えなかったが、とても優しそうな笑顔で「ほうほう、ふんふん。頑張ってね」と言ってくださったのが嬉しかった。とても親しみやすい方だと感じた。がんばります

RubyKaigi2022-1日目メモ

忘れないうちにメモ セッションの写真は資料がWeb上で公開されているもののみ。 セッションでスピーカーが話したこと、自分の感想混ぜて

RubyKaigi 2022 - RubyKaigi 2022

感想

  • Rubyをはじめて火が浅いが、ある程度理解できた。そして1日目にしてかなり刺激を受けている
  • 1セッションが短くて聞きやすい
  • ソロ参加者も結構多い。何人かとお話しできた。
  • コントリビューターの方の顔が見えると、自分も何かやってみようと思える
  • スポンサーブース楽しい
  • ランチが豪華

Sessions

Ruby meets WebAssembly(Key-note)

Ruby meets WebAssembly - RubyKaigi 2022 Ruby meets WebAssembly - Speaker Deck - RubyがWebAssembly対応したよって話

Speaker

  • GoodNotesで働く 早稲田大学B4 @kateinoigakukunさん
  • CRubyコミッター

これまでのRubyの課題

  • ちょっとしたプログラムを公開したい場合、フロントでの実行ができないためサーバー上でRuby環境整備してあげないといけなかった
  • 環境構築も大変で、初学者が詰まってしまいがちだった
  • これらを解消すればよりRuby開発体験が良くなるのでは?

WebAssembly(WASM)で解消!

そもそもWASMとは

  • stack-based machine用のフォーマット→Webブラウザで動かせる
  • JSを補完・並行しながら動作できる  - ref: WebAssembly | MDN

WASMが解決するもの

  • どこでも動かせる。
  • 初学者が環境構築でつまづかなくて済む
    • 感想:GoogleColabやJSPlaygroundのようにブラウザ上で動作させられるIDEも出てくるのかなーと期待している

一般的なWASMの動き

  • コンパイルし.wasmファイルを作成
  • ブラウザ上で実行

CRubyのばあい?

  • ruby.wasmでRuby実行環境用意し、.rbファイルをダウンロードしてブラウザ上で実行させている
    ruby-wasm

ブラウザ上irbデモ

- https://irb-wasm.vercel.app

  • ブラウザ上irbでSVGgem使ってSVGを表示させているところ

WASM用のhtmlを組んでいるところ

- 簡単に書ける感じ良い

どうやって動いている

  • ブラウザ上だけてで無く、サーバーレスプラットフォームでもいける
  • ブラウザのJSと共に動いているわけではない

WASIについて

  • プラットフォーム非依存なインターフェイス
  • WASIサポートはかなり広がっている

wasi-vfs

  • .rbをバイナリ変換して.wasmに内包する形で配置させるもの
  • サーバーからダウンロードする必要がなくなる
  • before
  • after
  • Read-only なrbをバイナリとして内包させておく
  • Ruby3.2から
  • npmもある ruby/ruby.wasmを使うとよい

CRubyをWASMとWASIに対応させるための道のり

  • CRubyはCで書かれているから…CからWAにコンパイルするのは楽だよね…!そんなことはなかった
  • setjmp/longjmp

  • vm_execでひたすらrubyを動かしているが

  • エラーraiseすると「ロングジャンプ」が発生する
  • (ここはよくわからなかった………)

FIberについて

[https://docs.ruby-lang.org/ja/latest/class/Fiber.html](https://docs.ruby-lang.org/ja/latest/class/Fiber.html)

保守的GC

  • WASMのVM内のCスタックは線形メモリだからスキャンできる
  • ValueStackは保護Stackだからscanできない
  • CallFrameも読めない

  • pauseとresume サポートを担ってくれるのがAsycify

  • JSのAsyncをCのsyncから呼び出すためののもの

  • コンパイルして元のプログラムではできない動きを再現する

    sleepしている間にmainまで戻ってくる→sleep中に他にやりたいことが自由にできる

  • 1回目にsleepしていた時の挙動を2回目のfoo-callで再現できている
  • 直接お話しした、mainに戻ってくる際にローカル変数を全て回収してきてるから再現できる、つまりローカル変数が増えると…

  • ここは勉強しないとわからない

  • 現時点ではバイナリさずはでかい

  • Asyncifyによるオーバーヘッドでスピードはまあまあ落ちる

  • ruby.wasmはnpmで配布中

  • とりあえずブラウザirbで試してみよう

ここからはスクショは後で貼る

--

MaNy Project

  • 参考資料

    【Ruby】Thread(スレッド)を理解する - Qiita

    【Ruby】Fiber(ファイバー)を理解する - Qiita

    class Fiber

  • Make MANY threads >100k を目標にしている

    • M:Nはいいらしい
      • 例えば、OSの提供スレッドとして使った過去がある
      • JAVAでもある
  • 二つのスケジューラー
    • ractor lebelスケジューラー M:Nmodel

    • Thread level schedular 1:N
  • これまでのHandle blocking

    スクリーンショット 2022-09-08 13.43.05.png

    • マネージドのものはインタープリンターが頑張っていたが、unmannagedなものが出ると諦めていた
  • ManyPJでは Unmagaedなものは dedicated native threadという概念で対処する

    スクリーンショット 2022-09-08 13.45.48.png

    スクリーンショット 2022-09-08 13.46.33.png

互換性の問題

スクリーンショット 2022-09-08 13.47.06.png

これからするthreadはDNTを使うという宣言を用意して互換性に対応

MNの利点

  • いろいろ軽量になる
  • MNにするとネイティスレッド気にせずに移行ができるようになる
  • ネイティブ<<<rubyスレッドのほうが早いからいいやんと思っていたがネイティブも結構早い

MNの欠点

  • 若干のオーバーヘッド
  • 互換性の問題
  • Rubyプロセスの外から見た時に形が違う

Fiber Schedularとの比較

スクリーンショット 2022-09-08 13.50.08.png

スクリーンショット 2022-09-08 13.51.20.png

DNT  dedicated native thread

評価

  • Thread 作った時

    スクリーンショット 2022-09-08 13.51.51.png

    17マンスレッドくらいでネイティブだとダメになる、MNのほうが早いが、想像していたものほどではなかった

  • GCoverhead GC無効にするとめっちゃ早い→オーバーヘッドのせい

    スクリーンショット 2022-09-08 13.52.44.png

  • Ractor 生成 話にならない。GCオーバーヘッドが深刻

    スクリーンショット 2022-09-08 13.53.41.png

    スクリーンショット 2022-09-08 13.53.55.png

  • これよくわからん

    スクリーンショット 2022-09-08 13.54.17.png

    一周するのにかかる時間

    一周するのにかかる時間

    RubyのスケジューラーとコンフリクトしてMasterは遅い

    スクリーンショット 2022-09-08 13.55.12.png

    Native抜いてグラフ見てみる

    • Goの方が早いからまだ頑張れる

      スクリーンショット 2022-09-08 13.55.31.png

      スクリーンショット 2022-09-08 13.55.51.png

    • リーダーとライターを別々にして改良したもの

      スクリーンショット 2022-09-08 13.56.56.png

      スクリーンショット 2022-09-08 13.57.08.png

これから

- LINUX以外でもサポートして、できれば3.2に入れたい

    ![スクリーンショット 2022-09-08 13.59.54.png](https://s3-us-west-2.amazonaws.com/secure.notion-static.com/30adf71b-73ff-4886-bb14-a4c3f51ec482/%E3%82%B9%E3%82%AF%E3%83%AA%E3%83%BC%E3%83%B3%E3%82%B7%E3%83%A7%E3%83%83%E3%83%88_2022-09-08_13.59.54.png)

    - Ractor local GC オブジェクトヒープが分かれているからローカルでやったらいいんじゃないかという考え

Types teaches success, what will we do?

Types teaches success, what will we do? - RubyKaigi 2022

Types teaches sucess!!!

  • 型付けをしましょう!そしてgemfileの型付けコントリビュートをしましょう!というお話

RBS,Steepなどが3から同梱されるようになった

  • 小さく始めらる
  • コードそのものとは別に使えるのでRubyの楽しさは失われない
  • だがまだ導入事例は少ない

なぜ導入事例が少ない?

  • RubyGems.orgには17万のgemがあるが
  • rbsのgemsはどれくら意サポートしてうる…?
    • 44件しか型定義されていない……すくない

gem_rbs_collectionにコントリビュートして増やしましょう!

どうやればコントリビュートできる?

gemrbsはなに

  • gemの型定義を集めたもの

コントリビュート方法

  1. まずは対応していないgemを見つける
    1. steep checkで型定義と実装のずれをチェックできるがそれで見つかることが多い
    2. .source_locationで元を見る
    3. 型をチェックしよう
    4. ブロックを受け取れない状態であれがgem_rbsに受け取れるように記述を追加しよう
  2. 対応していなければ、環境構築後やってみる。
  3. 自動でも生成できる

部分的に定義する方法

  • 自分がよく使うAPIを定義すると良い
  • 使うとこだけでいい

Generatorで自動生成

  • rbs prototype rb でソースファイルと生成名を指定して実行する

使い分けは?

  • 明確にこのAPIが欲しいとわかっていたら部分的ん手動で
  • PJでsteepチェックした時に特定のgemで大量に出たら自動生成

  • 感想:Rubyの型付けについてはとても興味があったので面白かった。小さなところからgem型付けコントリビュートしていけそうで良い

Adding Type Signatures into Ruby Docs

Adding Type Signatures into Ruby Docs - RubyKaigi 2022

  • Rubyapi.org開発のお話
  • Rdocのサイトで調べるとアルファベット順にAPIが出てくる。重要なもの順に出てきて欲しい、という課題解消をしたサイト
  • Ruby API (v3.1)

RDocsをもっと良くしようぜ

RDocsをよくするには

  • 型付しようぜ
  • typeanotationつけようぜ
  • TypeSignaturesを表示できるようにした

    IMG_9038.JPG

    • かなりわかりやすくなってる
  • bug_triaging.rdog

  • rdoc . で自動生成できる
  • localでもパッと見れるよ
  • format指定もできる

potフォーマットとは?

- pot→powerpointドキュメンテーション

  • 簡単なドキュメンテーションの例

IMG_9039.JPG

IMG_9040.JPG

  • call sequencesはプレーンテキスト、現状

    - だから型名、name,anameみたいな書き方が許させる

  • RBS
    • steep入れるといいよ
    • RBSで片付けしておけばRDocがよりいい感じになる
    • つけましょう
    • no_stdlib: true
  • Not optimized for human
    • 例えばgsubのこれ 人には読みづらい……

    • 改良して人にも読みやすい、書きやすいものに改良する挑戦をしている

      • 不要な書き方の修正、シンタックスハイライト対応など
    • ぜひコミッターになったり意見送ってね

Ruby4のJITについて

Towards Ruby 4 JIT - RubyKaigi 2022

Ruby -> AST -> Bytecode -> 機械語 (おさらい

BYOJ Biring Your Own JIT!!

  • 自分自身のJITを作るってこと!?

https://twitter.com/_craftscat/status/1567770392533823488?s=20&t=2ST_Nc3PdR5TT0ATWcgpqQ

そもそもJITがよくわかっていないので読む

RubyがいかにJITと向き合ってきたか

https://twitter.com/watson1978/status/1567771068110376960?s=20&t=rJ6hcpZloXp_GrFHz8Jj-A

https://twitter.com/watson1978/status/1567771179427180544?s=20&t=tUoU84wzwJ05L9P7lOtKRQ

MicroBenchimark

Ruby4 はJavaやJSより早くしたい

https://twitter.com/kokuyouwind/status/1567772989487476737?s=20&t=h9NmRmwJj31LqyMh7uy0HQ

GC

module GC

https://twitter.com/risacan/status/1567775625183920128

安全なWebアプリケーションの作り方[1-4.4章]

ハッカー(イメージ MR.ROBOT より)

安全なWebアプリケーションの作り方の「4.4 SQLインジェクション」までを読んだので備忘録として整理。

体系的に学ぶ 安全なWebアプリケーションの作り方 第2版[固定版] 脆弱性が生まれる原理と対策の実践 | 徳丸 浩 | コンピュータ・IT | Kindleストア | Amazon

どんな本?

  • Webサイトのセキュリティに関する情報を網羅的に紹介している。最低限のフロントエンドとしての知識があれば理解できるような丁寧な説明がある。
  • また全ての項に対応するよう実習用の環境が用意されており、ページとサーバーのやりとりを見ながらどのような脆弱性があるのか学習でき、非常にわかりやすい。 実際に文章で言われるより遥かに説得力もある。
  • 多くの脆弱性はは最近のフレームワークでは標準で対策されている。安心だね!
  • しかし、実際にどのような基本攻撃があるのかを知っておかなければさらに発展的な攻撃にも対応できないと考える。しっかりと読みたい。

この記事について

1-4.4章までを読み、自分が特に気になった箇所を整理した。

HTTPとセッション

HTTP認証

ステートレス認証ともよばれ、Basic,NTLM、Digest認証などがある。

特徴 例:Basic認証

Basic認証では401を返した後フォームを入力するとBase64エンコードされたIDとPassがAuthorizationヘッダーとして送られる.

Basic-example
Basic-example

以降のやりとりでは自動的に付与されるAuthヘッダーにより「毎回認証」を行なっている。

メリット

やりとりのどのタイミングから始まっても認証が切れない

デメリット

一度離れたら再度認証が必要。IDとPASSしか記録できない上、ヘッダーに保存することしかできない


クッキー

  • 初回時にセッションID名のクッキーを保存するよう,ブラウザにレスポンスで指示する.(実際の挙動をWASPで確認する)
  • 以降はこのセッションID名のクッキーをサーバに送信する

    セッションIDに求められるもの

  • 三者がセッションIDを推測できないこと
  • 三者からセッションIDを強制されないこと →セッションID固定攻撃を防ぐため.不正なセッションIDを強制的に付与され,その後保存した値を抜き取られる. →認証完了時点でセッションIDを変更することで防げる
  • 三者にセッションIDが漏洩しないこと →ネットワーク上で盗まれる可能性

  • クッキーにはセキュア属性を付与することができる.

    • HttpOnly属性を設定するとJavascriptによるXSSでは盗むことが難しくなる.
      • つけておくと良い。
    • SameSite属性.

    php SameSite = Lax

    を指定すると他サイトからのPOSTで遷移した際にクッキーが送信されなくなる.CSRF対策になる.

クッキーの脆弱性をついた攻撃例

XSS

  • iframeに脆弱なサイトURLとともにscriptを埋め込んで読み出す。

  • 検索キーワードに脆弱性があるサイト利用者の攻撃を想定

  • 脆弱性のあるサイトからセッションIDを盗み、攻撃者のサイトに遷移させ送信する。

クッキーの属性にhttpOnlyをつけ、JSによる呼び出しを防ぐことで対策

4章 Webアプリケーションの機能別に見るセキュリティバグ

表示の脆弱性による攻撃-画面書き換えによるもの-

入力フォームに脆弱性がある場合、

(OWASPのresを見せながら実演) 今回は

<input type=text name=mail value=<?php echo $_GET['p']; ?>>>

のように属性値をダブルクオーテーションで囲わなかったことが脆弱性に繋がっていた。 このようなメタ文字の持つ特殊意味を利用して行われるのがXSS。回避するためにはHTMLの「エスケープ」を行い、意味を打ち消す

ただしダブルクオーテーションで囲っていてもダブルクオーテーションをエスケープしないと

"script = ... "

のような攻撃から守れない。

エスケープ方法

htmlspecialcharsを使ってPHPではエスケープする。

Vueのセキュリティ

  • HTMLエスケープは自動。安全なHTMLであれば明示して描画できる(v-html
  • URLの挿入対策にはsanitize-urlというライブラリがある

v-htmlの値にユーザーからのinputを渡さないこと(このような攻撃が可能 https://qiita.com/tnemotox/items/b4b8f0f627e23dd62447

表示の脆弱性による攻撃-XSS-

上述済

入力による脆弱性

ヌルバイト攻撃

バイナリセーフ:どのようなバイト列であっても扱えることを意味する。値ゼロ\0が来ても続けて読み取る。Cなどではヌルバイトは末端記号と扱うため「バイナリセーフ」ではない。

そのため 2 \00 <script>... のような文字列を入力として受け取ると、チェックを素通りし\00 以降のスクリプトが実行されてしまう(実演)

入力値の検証には正規表現で指定した形式にマッチしているか判定するのがよい。

SQL呼び出しに伴う脆弱性 -SQLインジェクション-

攻撃する側としてまず何をするのが効率いいのか?

IMFORMATIONS_SCHEMA というSQL標準規格のテーブルを表示させよう。

これによりtable/rowの定義を表示させらられる。 得られた情報から欲しい情報が入っていそうなtable/rowを優先して攻撃する。

UNION SELECT を使う。 - 二つのSQL文の結果を結合して求められ得る - 一度の攻撃で大量のデータを取得できる。

対策:プレースホルダーを使おう

  • 特にユーザーが指定できる値については変数でJSの変数で代入させるのではなく、placeholderを使うべき

ここまでのまとめ

ほとんどの攻撃は最新のフレームワークでは標準で対策されているが、実装者も気をつけなければ知らずに「対策の例外処理」を実装してしまいかねないと感じた。 CTFにも役立ちそう。 後半はさらに複雑な攻撃も登場するので楽しみ。

リーダブルコード【1-3章】

今回はこちらの1-3章を読んだので,途中ですが内容を紹介します

コードは理解しやすくなければいけない

  • コードは「読む」時間の方が長い

じゃあ,良いコードとは?

  • 読みやすい,即ち 「他人が最短時間で理解できる」 コード
  • 読みやすい = 短い ではない.
  • 様々な状況に於いて「読みやすさ」を当てはめる方法を紹介するのが本書.

名前に情報を詰め込む[1部2章]

名前に情報を詰め込む方法

  1. 明確な単語を選ぶ
  2. 汎用的な名前を避ける
  3. 抽象的な名前よりも具体てな名前をつける
  4. 接尾辞や接頭辞をつかって情報を追加する
  5. 名前の長さを決める
  6. 名前のフォーマットで情報を伝える

1. 明確な単語を選ぶ

GetPage 何をゲットするの???

  • 明確な単語をつけるべき.
  • get→どこからとってくるの?何をとってくるの?不明瞭

余談:getなのかsetなのかは丁寧に使い分けよう

var size() なんのサイズなの?

  • オブジェクトの項目数?メモリ数??

stop どう止めるの?

  • 完全停止っ→kill, 一時停止→pause(対義語:resume)などどのような状態になるか明確なものを選ぶべき

2. 汎用的な名前を避ける

tmpは数行の生存期間のものを選ぶべき

すぐに消えるとしても,数値の書き換えなどに使われるものは別の名前に こういうのはダメ.初めから”user_info”などにするべき

let tmp = user.name();
tmp += "" + user.phone_number();
tmp += "" + user.email();

template.set("user_info", tmp)

ループイテレータが複数ある場合はこれも明確な名前を

i, j, k などを使うとfor文バグが発見しづらくなる. 例えばそれぞれを,names[i] favorites[j] coutories[k] のように使うなら name_i favorite_i countory_i といった名前に変えるとより分かりやすい. ni fi ci と簡潔にしても良い. このイテレータは何に使われてるんか? が,コードを辿らずともわかるようにしよう

3. 抽象的な名前よりも具体的な名前を使う

  • Webページをクローリングしてデータを収集する関数,どれがいいかな? A. WebCrawler B. CollectDataFromWeb C. WebWaler

  • A. WebCrawler       →クローリングして何をするのかが不明瞭 不適 B. CollectDataFromWeb    →最終的に何をするのかが明確. C. WebWaler    →カッコよく最高にイケているが,抽象的で凡人には理解できない


「宇宙船の名前」とか「コードネーム」なら抽象的でも構わないが…

SpaceX ロケット着陸用ドローン船  「Of Course I Still Love You(OCISLY)」

SF小説から取られている.関数名などには使わないようにしよう

万能ゆえに名前と実態がはっきりしないものを作るなら…

色々な機能を持つ複合的な関数を作ったはいいが,いまいち名は体を表せていない.それなら関数を分けるべき.

4. 名前に情報を追加する

値の単位をつけよう

  • sizesize_mb
  • delaydelay_hours

    重要な属性情報をつけよう

  • 平文パスワード → plaintxt_password
  • UTF-8に変換されたhtml → html_utf8

    5. 名前の長さを決める

  • スコープが小さければ短い名前でもいい. 行き先がすぐにわかるなら短くても良い.
  • 長い名前だってエディタ補完があるので気にしなくて良い 例:anonymous は長い単語だが,略すと分かりづらい. isPostAno → isPostAnonymous

    6. 6. 名前のフォーマットで情報を伝える

  • クラスのメンバー変数などは接頭に Classname_varA などと付けて区別

    誤解されない名前にする.[1部3章]

    例:filter(‘year <= 2011’)

    これは

  • ‘year <= 2011’ のオブジェクトだけを残すのか
  • ‘year <= 2011’ でないオブジェクトを残すのかがわからない

    範囲指定

  • data_count_limit = 10 →  最大値なの?最小値なの?
  • 限界値は: min/max で定義しよう

そのほか

  • 範囲指定: first/last (n番目から→m番目まで )
  • 包含/排他: begin/end (n年からm年までの間のデータ)

    bool値の名前

    例: read_password = true;

  • 「もうすでに」よみっとたのか「これから」よむのかが分かりずらい
  • パスワードが必要なら「need_password」,すでにパスワードを読み取って認証済みなら「HasAuth」などにしよう

    ユーザーの期待に合わせる

  • get**() これはオブジェクトに含まれるメンバーの値を返すだけにするべき.整形などはしない方が良い. 例えば平均を求める関数に getMean()などと付けるべきではない. computeMean()などとするべき 実行コストの見積もりを誤り想定より挙動が遅くなる,などの問題につながりかねない.

    複数の名前を検討するのも良い.

    他人が見てどれが実態にあった名前かを議論し,良い名前にしていこう


引き続き読み進め,読みやすく分かりやすいコード実装にしてゆきます🙋‍♂️

# CSSのクロスブラウザとぶっ壊れた現象例

自分の書いたCSSsafariIEで開くとぶっ壊れる現象を多数目撃したのでまとめた.ちなみに自分のデフォルト検証ブラウザはChrome

pointer-events:none はIEでは使えない

[CSS]CSSの pointer-events で <a> タグのリンクを無効化する方法 | WEBデザインのTIPSまとめサイト「ウェブアンテナ」

えーそんな.仕方ないので他の方法でlink自体を表示しないようにした.

flexboxに配置した画像がsafariではクソデカになる

align-items: flex-start; をついきすれば解決する.

higashidadan.com

flexboxは最近でた大変便利なモノだが,主にIESafariなどでバグが起きる.対応しきっていないんだろうな.

display: flex;のバグ対応 | takblog

takblog.site

IEで displa:gridの中身が突き破ってくる

これも対応していないかららしい.ちなみこのような古いブラウザでも正しく表示させるにはベンダープレフィックスというものをつけるといいらしい. デザイン・CSSつよつよ同期に教えていただいた.

ベンダープレフィックスとは、CSSの新しいプロパティに付けて、記述したプロパティが拡張機能であることを、各ブラウザに示すために使われる識別子です。草案段階の仕様を先行実装する場合にも使用されます。勧告されたばかりのプロパティにベンダープレフィックスをつけることで、ブラウザはそれらの新しいプロパティに対応することができます。

www.itra.co.jp

たとえば display:flex を使う時はこんな風に書くといいらし.

.f-container {
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
}

なお,プレフィックスを付けていないものも併記する必要があるとのこと.(フォントファミリーの指定と似たようなのものかな?)

各ブラウザごとのプレフィックスはこんな感じ.

E 10
ベンダープレフィックス(-ms-)が必要
Safari 6.1-8
ベンダープレフィックス(-webkit-)が必要
Android 2.1-4.3
ベンダープレフィックス(-webkit-)が必要
iOS Safari 7-8.4
ベンダープレフィックス(-webkit-)が必要
【2020年最新】Flexboxの対応ブラウザとベンダープレフィックスまとめ | Web Design Trends webdesign-trends.net

CSSクロスブラウザ対応状況について

coliss.com

こちらはCSSつよつよ同期の先輩から教えていただいいた. 読み物として面白い. これを読むとflexbox登場は2013年ごろ,16年ごろに全てのブラウザでサポートされ,gridはさらに遅く2017年登場であることがわかる.

早くIE滅びて…

Virtual Boxからlocalhostにアクセスする

やりたいこと・背景

やりたいこと

Virtual Boxを使ってIE11での画面を確認したい. デプロイ環境ではなく,Macbookで建てたローカルにアクセスしたい.

今回利用したVMとイメージ

VMの設定はこちらの記事を参考にした.

www.ritolab.com

Virtual Boxの画面が小さい時はこちらを

pc-karuma.net

導入エラーが出たら

https://www.nemotos.net/?p=3707

www.nemotos.net

背景

Virtual Boxは 10.0.2.2 にアクセスすることでホストマシンの localhostにアクセスできる. なのでホストの localhost:3000 にアクセスしたければ 10.0.2.2:3000 を叩けばいい!はい終了!

こまったこと

ともいかず…開発しているサイトの仕様上(まあどこもそうだと思うが),ページ遷移のたびにURLが書き変わる. 例えば login画面 にアクセスし,ログインしてページ遷移するとURLは次のようになる.

10.0.2.2:3000/signin → localhost:3000/mypage こうなってしまうとVM上のlocalhostにアクセスしてしまうためうまくいかない.さらにセキュリティ上 10.0.2.2:3000/mypage と入力しても /signinにリダイレクトされる仕様になっているためサインイン画面から先に進めないのだ.

試したこと

プロジェクトのルーティングとかその辺をいじれよ,とも思ったがIEから同格するのは一瞬なので余計なことはしたくない.VM側の設定でなんとかしたい

hostsファイルをいじる

うまくいかなかった理由

そういう仕様だった

hostsファイルに以下の記述が

localhost name resolution is handled within DNS itself.
うわー!

Not being able to re-direct requests to localhost in the VM to the host's localhost is now baked in to Windows (https://tools.ietf.org/html/rfc6761#section-6.3), including the VM's available at https://developer.microsoft.com/en-us/microsoft-edge/tools/vms/
For security reassons Microsoft now prevents host file entries for overriding the address of localhost to anything other than the loopback address ::1. So adding a line the VM's host file such as 10.0.2.2 localhost will be ignored.

VM内のローカルホストへのリクエストをホストのローカルホストにリダイレクトできないことは、httpsで利用可能なVMを含め、Windowshttps://tools.ietf.org/html/rfc6761#section-6.3)に組み込まれるようになりました。 ://developer.microsoft.com/en-us/microsoft-edge/tools/vms/
セキュリティ上の理由から、Microsoftは、localhostのアドレスをループバックアドレス:: 1以外にオーバーライドするためのホストファイルエントリを禁止するようになりました。したがって、 10.0.2.2localhostなどのVMのホストファイルに行を追加しても無視されます。
Addressing localhost from a VirtualBox virtual machine - Stack Overflow(別の先輩が見つけてくださった.感謝)

先輩は古いバージョンのものを使っていたため,この方法が取れたようだ.(自分は最新版を使っていた) ちなみに今古いバージョンを落として起動しようとしてもうまくいかない.

解決策

netsh をつかって上書きする

Network Shell (netsh) は、コマンドライン ユーティリティであり、Windows Server 2016 を実行中のコンピューターにインストールした後、さまざまなネットワーク通信サーバーの役割とコンポーネントを構成してそれらのステータスを表示できます。
ネットワーク シェル (netsh) | Microsoft Docs

TCP/IPのパラメータを手動で制御するためのものらしい.(【Windows】netshコマンドでTCP/IPのパラメータを設定する:Tech TIPS - @IT

これを管理者権限で実行すればDNSの設定を上書きできるらしい.

Windowsボタンを押し,[command]とタイプすると出てくる.

command
command

記述方法は

netsh interface portproxy add v4tov4 listenaddress=[アクセスするIP] listenport=[ポート番号] connectaddress=[対応付するIP] connectport=[ポート]

今回は,コマンドプロンプトを右クリックし「管理者権限で〜」を選んで起動し,次のように書けば良い.

netsh interface portproxy add v4tov4 listenaddress=127.0.0.1 listenport=3000 connectaddress=10.0.2.2 connectport=3000

こちらを実行後にlocalhost:3000 にアクセスすると問題なく表示された! これ以外にもDBなどを建てている場合はそれらのポート番号についても同様の処理が必要になる.(自分の場合は4.5個やった…)

なお

「本来はlocalhostループバックアドレスとして明確に定められたアドレスなので明確に定められたアドレスなので,捻じ曲げるのはRFC的には好ましくない」とのご指摘をさらに別の先輩から頂いた.

??????????

ネットワークセキュリティの講義が良だった生物学科出身の僕には何も分からなかったがとりあえず「なるほどー🙇‍♂️」と返しておいた. ???????????

一回おちついて ループバックアドレス

ループバックアドレスとは、 ネットワークカード などに割り当てられた特殊なIPアドレスで、そのコンピュータ自身を示すIPアドレスのこと。あるコンピュータがネットワークを通じて提供している機能に自身で動作する別のソフトウェアからアクセスする場合や、ネットワークを利用するソフトウェアのテストなどに用いられる。
https://e-words.jp/w/%E3%83%AB%E3%83%BC%E3%83%97%E3%83%90%E3%83%83%E3%82%AF%E3%82%A2%E3%83%89%E3%83%AC%E3%82%B9.html

自分自身と通信するために必要なアドレスだということらしい.

IETFドキュメント”Special-Use IPv4 Addresses” ( RFC 5735 )には、127.0.0.0/8はループバック用に予約された IPv4アドレス であると記載されている。
このアドレスはどの組織やISPにも割り当てられていない。このアドレスブロック’127.0.0.0/8’宛のパケットはホストシステム外へは出ない。
localhost - Wikipedia

なるほど.特殊なアドレスで,これを持っているパケットは外に出れないようになっているらしい.確かにこれを勝手に変えてしまったらまずいな.

RFC

RFC(Request for Comments)は、インターネットで用いられるさまざまな技術の標準化や運用に関する事項など幅広い情報共有を行うために公開される文書シリーズです。
インターネット10分講座 - JPNIC
インターネット標準ルールを議論・規定,広く公開するものなのかな?

つまり一般的によろしくないということらしい.

でもまぁ…今回はIEでのCSS対応状況を確認するためにしか使わないし,VMだしいいかな,ということにしておく.

おまけ

VirtualBoxくんのイメージもアプデするのね…だるすぎぃ

windows8-in-updating
windows8-upload