創って自己検証がしたい
思いついたものが創れる世界で、それを求める人が居るかもしれない。技術で解決できるものや、将来課題になるかもしれないことが自分の頭にあるなら、創ってみたい。
自分の頭の中にある考えや理論が、世の中にどう影響するのかを実際に見てみたい。
// hello, world. I'm
Engineer / Product Design / Business
想像力→創造力
技術とプロダクトデザイン、
ビジネスが好きなエンジニア。
Japan / JST · OSSと個人開発
夜の作業部屋/ JST
00
Now いまのこと
// a few things about me
- Currently
- OSSと個人開発
- Editor
- Neovim
- Interests
- 技術 / プロダクト / ビジネス
- Off-screen
- 妻と娘との日常
思いついたものを創ってみたい
// 02
これまでと、これから
01 / これまで
大学を休学し、原付での日本一周を途中で断念。ヒッチハイクに切り替え、人の好意に支えられる自分の無力さを痛感した。大学中退後は英語を活かして輸入業へ。サービスを自分で作るために、エンジニアの道を選んだ。
02 / いま
画像変換、文章の圧縮・検索、コード生成・解析など。興味のあることをAIで形に。創って、試して、自分の考えを確かめる。
03 / これから
顧客目線でプロダクトと事業を考え、関わる人の幸せの一助になりたい。
IMAGE PROCESSINGlazy-image画像変換のサイズ・品質・処理を確かめる
TEXT / SOURCE EVIDENCEqzt原文を圧縮して保存し、根拠を辿る
API TOOLINGcdn-security-frameworkOpenAPIからWorkerコードを生成する
CODE EXPLORATIONCodebaseCanvasコードの構造と依存関係を辿る
I18N TOOLINGi18next-turbo翻訳キーの抽出・診断
創ったものを
実際に触ってみてもらいたい
// 02 — Projects & open source
創ったもの
今気になる課題や、これから課題になりそうなことを、形に。
それを求める人が居るかもしれないから、みんなが触れるようにしておきたい。
01 / IMAGE PROCESSING
lazy-image
画像変換のサイズや品質、処理の違いを確かめるためのライブラリ。この画面ではlazy-image、jSquash、ImageMagick、Photonを同じ画像で比較できる。
02 / TEXT / SOURCE EVIDENCE
qzt
LLMとの会話が増えるほど、失われる文脈も増えると思う。記憶の根拠を辿れるように、原文を圧縮して保存し、必要な部分を復元するためのコンテナ。
03 / API TOOLING
cdn-security-framework
OpenAPIの定義からPolicy候補とWorkerコードを生成する。この画面では診断と生成内容を確認して、JavaScriptを保存できる。
04 / CODE EXPLORATION
CodebaseCanvas
コードの構造や依存関係を解析するプロダクト。この画面ではサンプルや自分のgraph.jsonを開いて、関係とその根拠を辿れる。
05 / I18N TOOLING
i18next-turbo
JavaScript・TypeScriptから翻訳キーを抽出する。
このサイトの二言語対応にも使うRustエンジンを、端末内で試せる。
// 03 — Skills & interests
技術と関心
プロダクトのあり方やビジネスとしての方向性、未来について考えたい。
顧客目線で解像度を高め、関わる人の幸せの一助になりたい。
01
Languages
02
Engineering
03
Product & Design
04
Business
05
Everyday tools
考えや理論が世の中にどう影響するのか
技術、プロダクト、ビジネスを通して確かめたい
// 04 — Writing & notes
考え
考えや日々の暮らしをnoteに。
僕の考えに興味を持ったら、読んでもらえると嬉しい。
// 05 — Philosophy
考えと創る理由
技術で縮められる格差もあると思う。
OSSのような形で、みんなが触れるようにしておきたい。
想像力→創造力
顧客目線で考える
プロダクトのあり方や、ビジネスとしての方向性、未来について、顧客目線で解像度を高めていきたい。
創って自己検証する
自分の頭の中にある考えや理論が、世の中にどう影響するのかを実際に見てみたい。
みんなが触れるようにしておきたい
思いついたものを創って、それを求める人が居るかもしれないから、OSSのような形で公開しておきたい。
関わる人の幸せ
プロダクトや事業の未来と、関わる人の幸せを考えたい。
// 06 — Contact
連絡先
仕事やOSS、プロダクトの話など、全般。
僕の意思決定や思考を聞きたいという連絡をもらえると嬉しい。
仕事・OSS・意思決定や思考について
X、note、GitHubはこちら。
// 07 — Playground
実際に触ってみる
創ったものがどう動くのか、ここで試せる。
自分の画像や文章、graph.jsonでも確かめてみてもらいたい。
// playground / 05
i18next-turboTRY IT
JavaScript・TypeScriptから翻訳キーを抽出する。
このサイトの二言語対応にも使うRustエンジンを、端末内で試せる。
i18next-turbo 0.5.3のRust/SWC抽出エンジンをWasm化した、単一ファイルのデモです。t・i18n.t・Trans・selectorに対応。watch・ファイル間参照・翻訳ファイルの同期・Node pluginはこのデモの対象外です。解析できないキーは診断に残します。最大15秒でWorkerを終了します。
比較はi18next-cli 1.75.3の公式解析コード＋SWC Wasm 1.16.18と、TurboのWasm版で実行します。CLIのWasm約18 MBは比較時だけ読み込みます。設定はen/ja・t・i18n.t・Transで共通。コメント抽出は無効、未指定の名前空間はtranslationとして照合します。CLIの起動・ファイル入出力・同期を含む速度比較ではありません。診断がないことは網羅性の保証にはなりません。
// playground / 01
lazy-imageTRY IT
画像のサイズや品質、処理時間を実際に確かめる。
lazy-imageと他のWasmライブラリを、同じ画像で比較できる。
容量の目標に合わせて品質を探す
品質45〜指定上限で探索。strictなら目標未達をエラーにして、出力しません。
画像を外部に送らずに処理する
外部へ送信せず、メタデータを保持しない設定で再エンコードします。
読み込みとリサイズは1回
同じ画素から品質を変えてencode。工程時間と画素バッファの目安を確認できます。
このデモの入力・出力の保護
- 入力はJPEG・PNG・WebP、5 MiB / 16 MPまで。ヘッダーの寸法をデコード前に検査します。
- 処理は各Worker最大30秒。中止・ページ移動でWorkerを終了します。
- 出力の形式・寸法・サイズ目標と、ブラウザでのデコードを確認してから表示します。
画素数の制限は、総メモリの上限保証ではありません。ここで触れるのはWasm版1.4.3です。Node.js版のsanitize・検証済み画像セット生成は別のAPIです。
反復計測は1つのWorkerずつ実行し、計測中はプレビューを作らず、先行出力を保持しません。初期化・変換・出力検証を分離し、初回と1回ウォームアップ後の反復を記録します。表示用の再変換とRGB PSNRは全計測後で、時間集計から除外。画質の基準は同サイズのjSquash decode＋Lanczos3、PSNRは白背景RGBの誤差で、知覚画質や同画質の証明ではありません。実行順・キャッシュ・端末負荷・少数試行の影響は残ります。
専用環境で測ったメモリを見る
Node/Wasmを1試行ごとに独立プロセスで実行し、OSの最大RSSを記録しています。初期化・入力・Nodeを含むプロセス全体の実測で、このブラウザやCloudflare Workersのメモリではありません。GPUとRSS採取後の画質分析は含みません。
// playground / 02
qztTRY IT
会話のコンテキストと、その根拠を追えるようにしたかった。
この画面ではnoteの本文などを入力して、圧縮・検索・原文復元を試せる。
QZT v0.1/coreのブラウザアダプターです。Zstd Wasmで実圧縮し、同じ圧縮データから検索・復元します。検索は全チャンクを復元して走査、行復元は必要なチャンクだけを処理します。QZI索引・辞書・持ち込んだ.qztは未対応です。公式CLIで検証・原文exportできる形式です。入力は読み込んだページのメモリ内だけで扱い、各Workerは最大15秒で終了します。
// playground / 03
cdn-security-frameworkTRY IT
OpenAPIからどんなPolicy候補やWorkerコードが生成されるのか。
入力を変えて、診断と生成内容を実際に確かめられる。
公式のOpenAPI解析・Policy候補生成ロジックと、公式compilerで生成したProfile別Workerを使うブラウザアダプターです。生成コードにはglobal request設定を反映します。認証の対応付け・秘密情報の設定・ルート別制御は自動生成しません。未対応項目は診断に残し、コードは実行・デプロイしません。公開mainの固定commit 27211fa9 (2.0.0-rc.0) を使用しています。
// playground / 04
CodebaseCanvasTRY IT
コードの構造や依存関係を、根拠と一緒に辿る。
サンプルの構造図や、自分のgraph.jsonを開いて確かめられる。
v0.1 · 1 MiB · 500 nodes / 1500 edgesまで
Playgroundを読み込んでいます…
LOCAL FILE / SAMPLEgraphを読み込んでください。
STRUCTURE / 選択して探索
NODES 0件
対応関係: contains / imports / injects / calls / exposes / depends_on。reads / writesは公式v0.1契約の予約語で、現行validatorでは未対応です。
graphと入力ファイルは端末内で扱います。持ち込んだgraphのパスは表示だけで、ソースを自動取得しません。メソッドは選択したクラスから展開できます。新しいソースの解析はローカルCLIで行い、更新したgraph.jsonを読み込んでください。
~/portfolio — terminal
❯ :q!
hello vimmer!
サイドバーからファイルを開けます。
// 404
ファイルが見つからない
サイドバーから、開きたいページを選んでください。