Contributing to Deno is fun!

Deno Fest ディノフェス - presented by toranoana.deno
https://deno-fest-2023.deno.dev/

Transcript

1. Contributing to Deno is fun!
   pixiv Inc.
   森内建太 petamoriken
   2023.10.20
   

   View Slide

2. 2
   自己紹介
   ● Web エンジニア
   ● ECMAScript や WHATWG を追うのが好き
   ● よく仕様についての記事を書いています
   petamoriken
   プロダクト支援本部
   課題解決部（福岡）
   

   View Slide

3. View Slide

4. 4
   目次
   ● Deno の構成
   ● Deno 内部の JavaScript
   ● primordials.js について
   ● コントリビュート手順
   ● プルリクエストの具体例
   

   View Slide

5. 5
   Deno の構成
   ● Cargo (Rust) ワークスペースで管理されている
   ● https://github.com/denoland/deno
   ○ cli コマンドライン
   ○ runtime 実行部分
   ○ ext Web 標準 API、FFI、Node.js 互換レイヤーなど
   ● https://github.com/denoland/deno_core
   ○ core V8、JS と Rust を仲介する部分 (ops) など
   

   View Slide

6. 6
   Deno 内部の JavaScript
   ● Deno API のインターフェースは JavaScript で実装されている
   ○ Web 標準 API、Node.js 互換レイヤーなど
   ○ ファイルシステム、ネットワークなど外界とのやり取りは
    Rust
   ● 実行時に都度テキストとして読み込むと時間がかかる
   👉 V8 スナップショット機能で JavaScript と ops の初期化処理を高速化
   

   View Slide

7. pub fn create_runtime_snapshot(snapshot_path: PathBuf) {
   let fs = std::sync::Arc::new(deno_fs::RealFs);
   let mut extensions: Vec = vec![
   deno_webidl::deno_webidl::init_ops_and_esm(),
   deno_console::deno_console::init_ops_and_esm(),
   deno_url::deno_url::init_ops_and_esm(),
   deno_web::deno_web::init_ops_and_esm::(
   Default::default(),
   Default::default(),
   ),
   // ...
   ];
   7
   deno/runtime/build.rs
   

   View Slide

8. function quoteString(string, ctx) {
   const quote = ArrayPrototypeFind(
   ctx.quotes,
   (c) => !StringPrototypeIncludes(string, c),
   ) ?? ctx.quotes[0];
   const escapePattern = new SafeRegExp(`(?=[${quote}\\\\])`, "g");
   string = StringPrototypeReplace(string, escapePattern, "\\");
   if (ctx.escapeSequences) {
   string = replaceEscapeSequences(string);
   }
   return `${quote}${string}${quote}`;
   }
   8
   deno/ext/console/01_console.js
   

   View Slide

9. 9
   primordials.js について
   ● プロトタイプ汚染されても問題なく内部コードが実行できるようするためのもの
   ○ deno_core/core/00_primordials.js で提供される
   ● CI で dlint prefer-primordials ルールでチェックされる
   // NG
   ["foo", "bar"].include("foo");
   // OK
   const { ArrayPrototypeInclude } = window.__bootstrap.primordials;
   ArrayPrototypeInclude(["foo", "bar"], "foo");
   

   View Slide

10. 10
    コントリビュート手順
    1. イシューを見つける
    ● good first issue ラベルが付いているものが取っつきやすいです
    2. 取り組むことを宣言する
    3. プルリクエストを作成する
    ● わからない箇所は Discord や日本コミュニティ Slack などで気軽に聞いて👌
    ● 見てもらう前に cargo test ./ tools/format.js ./tools/lint.js を
    実行して CI を通す
    くわしくはコントリビュートガイドへ
    https://docs.deno.com/runtime/manual/references/contributing/
    

    View Slide

11. 11
    プルリクエストの具体例
    ● feat(console): Display cause errors in console #12462
    

    View Slide