Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Contributing to Deno is fun!
Search
petamoriken / 森建
October 20, 2023
Programming
0
380
Contributing to Deno is fun!
Deno Fest ディノフェス - presented by toranoana.deno
https://deno-fest-2023.deno.dev/
petamoriken / 森建
October 20, 2023
Tweet
Share
More Decks by petamoriken / 森建
See All by petamoriken / 森建
Denoでフロントエンド開発 2025年春版 / Frontend Development with Deno (Spring 2025)
petamoriken
1
1.4k
非ブラウザランタイムとWeb標準 / Non-Browser Runtimes and Web Standards
petamoriken
0
550
ふかぼれ!CSSセレクターモジュール / Fukabore! CSS Selectors Module
petamoriken
0
250
フロントエンドの標準仕様をどう追っているか / How I follow the frontend standards specs
petamoriken
4
2.2k
ECMAScript、Web標準の型はどう管理されているか / How ECMAScript and Web standards types are maintained
petamoriken
3
570
DOM Observable
petamoriken
1
270
Deno に Web 標準 API を実装する / Implementing Web standards API to Deno
petamoriken
0
700
Stage 2 Decorators の変遷 / Stage 2 Decorators history
petamoriken
0
6.9k
linaria: Zero-Runtime CSS in JS
petamoriken
2
2.4k
Other Decks in Programming
See All in Programming
Google I/O recap web編 大分Web祭り2025
kponda
0
2.9k
DockerからECSへ 〜 AWSの海に出る前に知っておきたいこと 〜
ota1022
5
1.8k
「リーダーは意思決定する人」って本当?~ 学びを現場で活かす、リーダー4ヶ月目の試行錯誤 ~
marina1017
0
240
あなたとJIT, 今すぐアセンブ ル
sisshiki1969
1
720
Claude Code と OpenAI o3 で メタデータ情報を作る
laket
0
140
The State of Fluid (2025)
s2b
0
190
#QiitaBash TDDで(自分の)開発がどう変わったか
ryosukedtomita
1
380
オープンセミナー2025@広島「君はどこで動かすか?」アンケート結果
satoshi256kbyte
0
200
兎に角、コードレビュー
mitohato14
0
150
State of CSS 2025
benjaminkott
1
120
CEDEC 2025 『ゲームにおけるリアルタイム通信への QUIC導入事例の紹介』
segadevtech
3
960
『リコリス・リコイル』に学ぶ!! 〜キャリア戦略における計画的偶発性理論と変わる勇気の重要性〜
wanko_it
1
590
Featured
See All Featured
Rails Girls Zürich Keynote
gr2m
95
14k
[RailsConf 2023 Opening Keynote] The Magic of Rails
eileencodes
30
9.6k
GitHub's CSS Performance
jonrohan
1031
460k
Measuring & Analyzing Core Web Vitals
bluesmoon
9
560
The Art of Programming - Codeland 2020
erikaheidi
55
13k
GraphQLとの向き合い方2022年版
quramy
49
14k
Imperfection Machines: The Place of Print at Facebook
scottboms
268
13k
Building Flexible Design Systems
yeseniaperezcruz
328
39k
Why You Should Never Use an ORM
jnunemaker
PRO
59
9.5k
Fantastic passwords and where to find them - at NoRuKo
philnash
51
3.4k
Designing Dashboards & Data Visualisations in Web Apps
destraynor
231
53k
jQuery: Nuts, Bolts and Bling
dougneiner
64
7.9k
Transcript
Contributing to Deno is fun! pixiv Inc. 森内建太 petamoriken 2023.10.20
2 自己紹介 • Web エンジニア • ECMAScript や WHATWG を追うのが好き • よく仕様についての記事を書いています petamoriken プロダクト支援本部
課題解決部(福岡)
3
4 目次 • Deno の構成 • Deno 内部の JavaScript • primordials.js について • コントリビュート手順
• プルリクエストの具体例
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) など
6 Deno 内部の JavaScript • Deno API のインターフェースは JavaScript で実装されている ◦ Web 標準 API、Node.js 互換レイヤーなど ◦ ファイルシステム、ネットワークなど外界とのやり取りは Rust
• 実行時に都度テキストとして読み込むと時間がかかる 👉 V8 スナップショット機能で JavaScript と ops の初期化処理を高速化
pub fn create_runtime_snapshot(snapshot_path: PathBuf) { let fs = std::sync::Arc::new(deno_fs::RealFs); let
mut extensions: Vec<Extension> = 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::<Permissions>( Default::default(), Default::default(), ), // ... ]; 7 deno/runtime/build.rs
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
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");
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/
11 プルリクエストの具体例 • feat(console): Display cause errors in console #12462