Ghosttyの凄さを 技術的に深ぼってく

-- Views

March 27, 26

スライド概要

profile-image

Software engineer at Mercari. Devin Expert

シェア

またはPlayer版

埋め込む »CMSなどでJSが使えない場合

(ダウンロード不可)

関連スライド

各ページのテキスト
1.

Ghosttyの凄さを 技術的に深ぼってく Terminal Night #2

3.

Kuu - 自己紹介 ● ● ● ● Product Engineer @ Mercari Codex ambassador Cognition ambassador 趣味 ○ ○ 旅行 新しいものを試すこと

4.

Ghosttyは早くて、ネイティブに動いて機能が豊富 https://github.com/ghostty-org/ghostty

5.

Ghosttyで使うショートカット全部 ● ● ● ● ⌘+T -> タブを開く ⌘+D -> 横に分割 ⌘+Shift+D -> 縦に分割 ⌘+Q -> Ghosttyを閉じる

6.

cmuxなどの派生ソフトウェアも誕生してる libghostty として他のアプリケーションからWebViewのように呼び出せる https://github.com/manaflow-ai/cmux

8.

Ghosttyの言うFastは本当なのか、何が早いのか気になる ● 謳い文句でとりあえず、 “Fast” って付ければなんか凄そうに見えなくもない ○ ● 今回は、 “Feature-rich” の部分はスキップします ○ ○ ● 新しく作ったOSSに “Simple” って付けておけば嘘つかず凄そうに見える商法かもしれない ... 登壇者自身が全部に詳しくないので まさかり予防嘘つくのを避けるため AIと一緒に探索していきました ○ ○ ○ 自分自身でFact Check しながら、コードリーディングも頑張る コードの当たりを付けていき作業は人間には単調作業 スライドは明言しない部分は、人間が作成した

9.

速さ勝負といえば、昔からプログラミング言語 ● 早い言語といえば、Rustなイメージはある ○ ○ 言語戦争は今回したくない そもそも、詳しくない

10.

GhosttyはMITライセンス

11.

GhosttyのNativeとは ●

12.

GhosttyのNativeとは ● “each platform” (Windowsを除く)

13.

GhosttyのNative、macOS版を見ていこう ●

14.

GhosttyのNative、macOS版を見ていこう ● Swiftで書かれている!

15.

GhosttyのNative、macOS版を見ていこう ●

16.

GhosttyのNative、iOS版の実装もある!? ● 現在開発中っぽい雰囲気だった ○ 今後に期待

17.

Ghosttyのレンダリングについて見てみよう ●

18.

Shaderを使ってそう

19.

Shaderを使ってそう 深刻な問題 ❌ 登壇者は Shader について詳しくない

20.

AI 曰く、 Metal of Shadersには何があるのか

21.

Multi threadにいい感じに処理してくれる Thread について見ていこう

22.

Main thread + Render ThreadとI/O Threadが存在してる https://github.com/ghostty-org/ghostty/blob/f8a0a459/src/Surface.zig#L566-L574

23.

Main thread + Render ThreadとI/O Threadの使い分け

24.

Render Thread は120fpsで動いてるらしい

25.

Render Thread は120fpsで動いてるらしい ゲームや UI framework でよく使われるアーキテクチャになってる

26.

テキスト表示高速化の工夫 ● ● ● Terminal Emulator の究極の目的はテキスト表示 ここが遅いと、遅いソフトって言われそう(言ってしまう) 実際に見ていったら、工夫がちゃんとしてた terminal emulator でテキストが表示されるまで

27.

一番シンプルなテキスト表示 https://developer.apple.com/documentation/swiftui/text

28.

一番シンプルなテキスト表示 https://developer.apple.com/documentation/swiftui/text Terminal Emulator にはこれでは足りないらしい!

29.

Ghosttyの開発者も困ってたみたい

30.

Ghosttyの開発者も困ってたみたい

31.

シェーピングってなんだ...?

32.

Ghostty にテキストが表示されるまで 1. 何かしら状態変化が起こってテキスト表示が変更される 2. レンダリングすべきテキストを細かい単位に分割する a. Style, Font, Size などが変わった単位で分割 3. Core Text を使ってグリフ列に変換する a. b. c. フォント、フォントの何番目のデータなのか、座標 リガチャ、フォールバックの処理などもしないといけない 後述する 4. グリフ情報から表示するための画像(bitmap)を作成 5. 画像をレンダリング

33.

グリフ列変換の大変さ ● 文字から一意のグリフへ変換するまで ○ ○ ● フォントを特定 フォントの中からどのコードか特定 想像してみよう ○ ○ ○ ○ あ 国旗 ■ 󰏦 JP ■ 󰏤JM ■ Jがきたら、2文字目を見るまでわからない ... 👍 ■ 手の色など考慮しないといけない ... 󰼠 ■ 人数... 男性女性...

34.

GPUでテキストをレンダリングすると速そうで すよね?

35.

実は、GPUだけでレンダリングしてない ● グリフ ○ ● ● フォント、フォントの位置を示したもの グリフを画像化するのはCPUで行なってる グリフを複数パターンまとめてからGPUでレンダリング

36.

Spriteじゃん!ゲームかよ! https://www.google.com/search?q=sprite+game&num=10&sca_esv=ab7f61c36d6d1228&udm=2 &biw=1470&bih=836&sxsrf=ANbL-n6qDXXB5kc6z8hvo0jFxRGSor867A%3A1774611091012& ei=k2rGaYQ21MrV7w_O_JmQDQ&ved=0ahUKEwjEy8a9_b-TAxVUZfUHHU5-BtIQ4dUDC BI&uact=5&oq=sprite+game&gs_lp=Egtnd3Mtd2l6LWltZyILc3ByaXRlIGdhbWUyBRAAGIA EMgYQABgHGB4yBhAAGAcYHjIGEAAYBxgeMgYQABgHGB4yBhAAGAcYHjIIEAAYBxg eGAoyBhAAGAcYHjIGEAAYBxgeMggQABgHGB4YCkiiCVC7A1jHCHACeACQAQCYAW 6gAZUEqgEDNS4xuAEDyAEA-AEBmAIFoAKKAsICCBAAGAcYHhgTmAMAiAYBkgcBNa AHrw2yBwEzuAeGAsIHBTAuNC4xyAcMgAgB&sclient=gws-wiz-img#sv=CAMSVhoyKhBl LWtfSFd1TUlaSzh5dG5NMg5rX0hXdU1JWks4eXRuTToOMTdWbE5wbzltLWF5V00gBCoc CgZtb3NhaWMSEGUta19IV3VNSVpLOHl0bk0YADABGAcgrdjJtgpKCBABGAEgASgB:~:te xt=%E5%86%85%E3%82%92%E6%A4%9C%E7%B4%A2-,3D%20Games%20with%202D%20 Sprites%3A%20Exploring%20the%20Possibilities,-%E7%A7%BB%E5%8B%95

37.

Ghostty の “Fast” が口だけじゃないことがわかった ● ● ● 一般的なアプリケーションではなく、ゲーム並みにレンダリングに最適化している 自分が適当に作っただけでは作れなそう... Terminal Emulator を作りたくなったら、 libghostty を使おうと思った Ghostty は偉大だ