TauriとRustとSolidJSで作るEthereum Address生成機 / Ethereum Address Generator made by Tauri, Rust, SolidJS

社内勉強会の資料です。

https://github.com/serinuntius/ethereum-address-generator

Transcript

1. Tauri
   とRust
   とSolidJS
   で作る
   Ethereum Address
   生成機
   

   View Slide

2. What is Tauri?
   🪶 軽量 -
   アプリのサイズがElectron
   比で1/16
   です
   💻 省メモリ -
   メモリ使用量がElectron
   比で 60%
   少ないです
   ⚡️ 起動が速い -
   起動もめちゃんこ速いです
   🔥 No Chromium - Chromium
   に依存していません
   🌈 並列処理も得意 -
   バックエンドはRust
   なのでマルチスレッドも得意だよ
   📱 モバイルも対応予定 - iOS
   やAndroid
   やWASM
   にも対応予定です（soon
   ）
   🔑 セキュア - allowlist
   でAPI
   ごとに詳細に権限を分けれるので安全です
   Tauri
   はRust
   製のアプリフレームワークです
   

   View Slide

3. What is Ethereum Address Generator
   ？
   好きなEthereum
   のアドレスを生成するヤツ
   CPU
   で計算すると先頭４桁ぐらいのマッチングが限界か
   GPU
   で計算すると先頭8
   桁ぐらいであれば現実的な速度で出る
   詳細はこちら
   これを利用したハックとか😈
   リテラシーが高い人はアドレス先頭４桁と後部４桁でアドレスが正規のものかチェックする
   その習性を利用してよくハッキングに使われる
   ex)
   正しいアドレス: 0x abcd 1234000ae1c8e8ac27103e4ff65f42a4e 0000
   悪意のあるアドレス: 0x abcd e4a24f56ff4e30172ca8e8c1ea0004321 0000
   ` ` ` `
   ` ` ` `
   

   View Slide

4. Demo
   0:00
   

   View Slide

5. What is SolidJS ?
   ⚡ ハイパフォーマンス - UI
   のスピードとメモリ使用率のベンチで常にトップらしい
   💻 React
   っぽい - JSX
   で書ける！ useState
   的な概念もだいたい似てる
   ㌰㌍️ 簡単 - React
   のhooks
   は初心者にはとっつき辛いルールの上で成り立っているが、SolidJS
   はその辺をカ
   バーしている感じがする
   ちなみにTauri
   は別にSolidJS
   は マストではない！ React, Vue, Vanilla
   等々なんでも書ける。
   ` `
   

   View Slide

6. コードの解説とか(Tauri
   側)
   view full page
   #[tauri::command(async)]
   
   async fn generate_address(start_with: String) -> Result<(String, String), ()> {
   
   ...
   省略
   
   let key = Wallet::::new(&mut rand::thread_rng());
   
   let address = key.address().to_string();
   
   if address.starts_with(start_with.as_str()) {
   
   let hex_key = key.signer().to_bytes().encode_hex();
   
   println!("hex_key: {}", hex_key);
   
   if let Some(err) = tx.send((format!("{:?}", key.address()), hex_key)).err() {
   
   println!("err: {}", err);
   
   }
   
   break;
   
   }
   
   ...
   省略
   
   let answer = rx.recv().expect("failed to recvs");
   
   Ok(answer)
   
   }
   
   

   View Slide

7. コードの解説とか(SolidJS
   側)
   React
   と違うのは
   const calcByRust = async (target: string): Promise => {
   
   // await invoke('
   関数名')
   ってやるだけで非同期でRust
   の関数呼び出せる！
   
   //
   お手軽！！！
   
   const result = await invoke('generate_address', {startWith: target}) as string[];
   
   return [result[0],`0x${result[1]}`];
   
   }
   // `useState`
   の代わりに `createSignal`
   を使う
   
   const [address, setAddress] = createSignal('');
   
   const [secretKey, setSecretKey] = createSignal('');
   //
   しかも `createSignal`
   はどこにでも置ける
   
   const [address, setAddress] = createSignal('');
   
   const Component = () => {
   
   return (
   
   
   
   {address()}
   
   
   
   );
   
   }
   

   View Slide

8. 仕事で実際に使ってみてわかったRust
   のいいところ
   Result
   型がいい！
   あえて冗長に書いてます。
   fn get_file(path: Path) -> Result<(), Error> {
   //
   戻り値がResult
   型で、Ok
   かErr
   が入ってる
   
   let file = File::open(path);
   
   let mut contents = String::new();
   
   match file {
   
   Ok(f) => f.read_to_string(&mut contents).unwrap(),
   
   Err(err) => panic!("panic!!! {:?}", err),
   
   }
   
   Ok(())
   
   }
   

   View Slide

9. Result
   型
   Result
   は失敗するかもしれない処理の結果を表現する列挙型です。
   Result
   を無視するとwarning
   が出るのでエラーハンドリングを強制&
   可視化できる！
   Rust
   には例外がない
   エラーハンドリングをサボると可視化される仕組みがすごい
   let ok_value: Result = Ok(1);
   
   match ok_value {
   
   Ok(v) => println!("ok value = {}", v),
   
   Err(e) => println!("err value = {}", e),
   
   };
   
   //
   どちらか片方の場合だけ処理したいならif let
   が便利
   
   if let Ok(v) = ok_value {
   
   println!("ok value = {}", v);
   
   }
   
   // Ok
   の場合は中身を返し、Err
   の場合はpanic
   する
   
   assert_eq!(ok_value.unwrap(), 1);
   
   // unwrap
   と同じだが、panic
   時のエラーメッセージを指定できる
   
   assert_eq!(ok_value.expect("panic"), 1);
   

   View Slide

10. ?
    でエラーを返す
    Go
    が嫌いって言う人がよく言う if err != nil { return err }
    を書かなくていいw
    間違いなくスマートではある。ちなみにそんなに気にならない派。
    ?
    演算子 というシンタックスシュガーがあり、エラーをそのまま返せる
    ` `
    fn get_hoge() -> Result<(), Error> {
    
    let err_value: Result = Err("error message");
    
    // err
    がある場合はerr
    をreturn
    する, no_err
    にはOk
    時のあたいが入る
    
    let no_err = err_value?;
    
    
    
    // err
    の場合はここにはもう到達しない
    
    }
    ` `
    //
    こんなやつ
    
    if err := get_hoge(); err != nil {
    
    return nil, err;
    
    }
    

    View Slide

11. さっきの冗長なコードを ?
    で書くとこんな感じ
    ` `
    fn get_file(path: Path) -> Result<(), Error> {
    let mut contents = String::new();
    
    File::open(path)?.read_to_string(&mut contents)?;
    
    Ok(())
    
    }
    

    View Slide

12. コンパイラがめちゃくちゃ賢い
    なんで君それがやばいってわかるの？ってレベルで丁寧に検査されている
    最初はコンパイル通すのが大変だけど、通った時の安心感はやばい
    100%
    バグなく正しく動きそうな気がするw
    (
    決してそんなことはないけど、それぐらい型付けもしっかりしてる)
    

    View Slide

13. 学習曲線云々は、間違いなく誇大広告だと思う
    いざ仕事で書かなきゃいけない状況に追い込まれると、書けるようになる（経験談
    コンパイラエラーは、慣れるとすぐに解決できるようになるし、コンパイラのお気持ちもわかってくる
    Rust
    書いたこともないのに、学習コストが〜〜〜とか言ってる エアプおじさん は無視して🆗
    あと書く環境が大事
    特にこだわりがなければ、VS Code
    で rust-analyzer
    入れれば神
    静的型付け言語やったことがあって、参照とかのスタックとヒープの話がわかってればOK
    型推論も効くし最高
    ` `
    

    View Slide

14. まとめ
    Rust
    最高
    Tauri
    最高
    SolidJS
    最高
    

    View Slide

15. 参考文献
    Rust
    のOption
    とResult
    Rust GUI
    の決定版！ Tauri
    を使ってクロスプラットフォームなデスクトップアプリを作ろう
    

    View Slide