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
Biome is for JavaScripters
Search
unvalley
December 08, 2023
4
1.1k
Biome is for JavaScripters
A Slide for We Are JavaScripters! @43rd
unvalley
December 08, 2023
Tweet
Share
More Decks by unvalley
See All by unvalley
Plugin System in Rust based JavaScript / TypeScript Linters
unvalley
5
2k
Exploring ways to stay continuously involved with OSS
unvalley
3
3.6k
Building An Ephemeral Markdown Paper with AI
unvalley
3
1.1k
Thoughts and experiences on Rust and TypeScript
unvalley
2
370
Exploring Type-Informed Lint Rules in Rust based TypeScript Linters
unvalley
6
12k
Behind VS Code Extensions for JavaScript / TypeScript Linting and Formatting
unvalley
7
3.6k
Behind Biome
unvalley
11
3.8k
Better Unit Testing
unvalley
1
600
Featured
See All Featured
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
rmw
35
3.2k
Documentation Writing (for coders)
carmenintech
75
5k
VelocityConf: Rendering Performance Case Studies
addyosmani
332
24k
How to Think Like a Performance Engineer
csswizardry
27
2k
Making the Leap to Tech Lead
cromwellryan
135
9.5k
Bootstrapping a Software Product
garrettdimon
PRO
307
110k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
32
2.2k
How STYLIGHT went responsive
nonsquared
100
5.8k
The Invisible Side of Design
smashingmag
301
51k
The Cost Of JavaScript in 2023
addyosmani
53
9k
Principles of Awesome APIs and How to Build Them.
keavy
127
17k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
132
19k
Transcript
1 Biome is for JavaScripters @unvalley_ We are JavaScripters
About me - unvalley - A core contributor of Biome
- TypeScript / Rust / Scala @unvalley_ unvalley 2
Biome - One toolchain for your web project - パフォーマンスに優れたRust製のWebツールチェーン
- Analyzer / Linter / Formatterを提供(CLIとLSPで利用可能) - 採用事例が増えている Vercel (v0.dev)・Sentry (javascript-sdk)・ant-design, etc - Prettierと約97%の互換性(対象はJS, TS, JSX のフォーマット) - 181のLintルールを実装(ESLint, typescript-eslintなどからの移植や固有のもの) 3 Rome Biome
技術的な哲学 - エラーに対して、可能な限り修正提案・ヒントを示す - エラーメッセージを具体的にする - 専門用語の利用を減らす - コマンドやフラグの命名には冗長性をもたせる -
包括的な用語を利用する(差別的な用語を使わない) など他 https://biomejs.dev/internals/philosophy/ 4
Biomeを試す 5 - npm, yarn, pnpm, deno, bunで利用できます - Homebrewでもインストール可能:brew
install biome - 業務で使ってるプロジェクトやOSSなどで試してみてください - Docs : https://biomejs.dev - Playground : https://biomejs.dev/playground npx @biomejs/biome check --apply . // format and lint with npx
最近のアップデート - 🌎:ドキュメントの翻訳(・・) - 🤝:スポンサーの獲得(時雨堂・KANAME・個人) - 🎆:Prettier Challenge の達成 -
⚙:v1.4.1のリリース - 🌟:5.4k スター - 🎨:ウェブサイトのリブランディング 6
日本コミュニティの貢献 7 日本コミュニティはBiomeの普及を信じてくれている。 過去数週間で彼らはステップアップし、我々はコードと寄付による多くの貢 献を受けた。ありがとう!
Prettier Challenge : Write a pretty printer in Rust 8
Vjeux(Co creator of Prettier)・Guillermo Rauch(Vercel CEO)・ WASIX・napi-rs によるBountyプログラム。
Prettier Challengeで得られたもの - Bounty - 新規コントリビュータ - 多くのコントリビュータがPrettier Challengeに参加した -
@faultyserver, @TaKO8Ki がメンバーになった - Formatterのオプションに対する方向性 - https://biomejs.dev/formatter/option-philosophy/ - Prettierとは異なるフォーマットの判断(Divergence) - https://biomejs.dev/formatter/differences-with-prettier/ 9
Biomeの開発 10
Rust Part 11 - CSTによるError ResilientなParser実装 - RustによるAnalyzer / Linter
/ Formatterの実装 - CLI / VS Code Extension - WASMによるWeb Playground 他いろいろ
Web Part 12 - 対応言語(JavaScript / TypeScript / JSX /
JSON / CSS)の仕様 - 対応言語の既存Lint実装 - (ESLint / typescript-eslint, eslint-plugin-jsx-a11y etc) - 対応言語の既存Formatter実装 (Prettier) 他いろいろ
Lint Rule実装の雰囲気:noSvgWithoutTitle 13
自分の最初の貢献(2022-11-03) Rust初心者だったけど、Formatterの修正タスクをやってみた ここから関わり始めた 14
開発のためのドキュメント 15 - CONTRIBUTING.md : https://github.com/biomejs/biome/blob/main/CONTRIBUTING.md - 開発に関する情報のハブ - @ematipicoによるParserとFormatterの解説動画のリンクなどもあります
- Analyzer and Linter : https://docs.rs/biome_analyze/latest/biome_analyze/ - Parser : https://docs.rs/biome_parser/latest/biome_parser/ - JS Formatter: https://docs.rs/biome_js_formatter/latest/biome_js_formatter/
We seek contributors:参加方法はいろいろ 16 - コードコントリビューション(機能追加・バグ修正等)をする - ウェブサイトのデザインアイデアを投げる・実装する - GitHub
DiscussionやDiscordでアイデアを投げる・議論する・解決する - 他の利用者の質問に回答する - スポンサーになる Good First Issueがなくても、タスクは作れます(特にLintルール)。 興味があれば、気軽にDiscordやGitHub Discussionなどで、お声がけください。 自分ももっとBiomeの内部でも他のOSSでも、色々と幅を広げていきたい。