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
20170222-emscripten-fs
Search
chikoski
February 22, 2017
Technology
0
830
20170222-emscripten-fs
Explanation of file i/o in Emscripten generated codes
chikoski
February 22, 2017
Tweet
Share
More Decks by chikoski
See All by chikoski
20210825_ossx
chikoski
0
260
festudy02-wasm
chikoski
1
930
An overview of WebAssembly; how it is used, created, and applied?
chikoski
1
640
Functions in JavaScript
chikoski
1
1.1k
20171018-WASM
chikoski
2
1.3k
20171002-wejs
chikoski
1
530
20170924-html5conference-wasm
chikoski
5
10k
Equivalence_in_JS
chikoski
0
1.3k
いまさら振り返るPromise
chikoski
1
510
Other Decks in Technology
See All in Technology
わたしとトラックポイント / TrackPoint tips
masahirokawahara
1
200
Figma Dev Modeで進化するデザインとエンジニアリングの協働 / figma-with-engineering
cyberagentdevelopers
PRO
1
340
Comparing Apache Flink and Spark for Modern Stream Data Processing
sharonx
0
180
CAMERA-Suite: 広告文生成のための評価スイート / ai-camera-suite
cyberagentdevelopers
PRO
3
230
Sidekiq vs Solid Queue
willnet
11
7k
グローバル展開を見据えたサービスにおける機械翻訳プラクティス / dp-ai-translating
cyberagentdevelopers
PRO
1
110
Tokyo dbt Meetup #10 dbt Cloudユーザー会 & パネルディスカッション
dbttokyo
1
180
分布で見る効果検証入門 / ai-distributional-effect
cyberagentdevelopers
PRO
2
550
クラシルの現在とこれから
am1157154
1
340
Mackerelが取り組むオブザーバビリティ - Mackerel Tech Day
mackerelio
0
330
で、ValhallaのValue Classってどうなったの?
skrb
1
560
AWS re:Inventを徹底的に楽しむためのTips / Tips for thoroughly enjoying AWS re:Invent
yuj1osm
0
180
Featured
See All Featured
The MySQL Ecosystem @ GitHub 2015
samlambert
250
12k
Facilitating Awesome Meetings
lara
49
6k
Building Your Own Lightsaber
phodgson
102
6k
Principles of Awesome APIs and How to Build Them.
keavy
126
17k
GitHub's CSS Performance
jonrohan
1030
460k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
131
33k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
25
1.8k
[RailsConf 2023] Rails as a piece of cake
palkan
51
4.8k
Unsuck your backbone
ammeep
668
57k
How to Ace a Technical Interview
jacobian
275
23k
Building Applications with DynamoDB
mza
90
6k
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
37
1.8k
Transcript
Emscripten でのファイル入出力 Mozilla Tech speakers N.Shimizu (
[email protected]
/ @chikoski) Emscripten
Night!! #3 @Drecom (2017/02/22)
https://hacks.mozilla.org/2017/02/webassembly-will-ease-collaboration-on-next-generation-video-codecs/
Firefox 52 で正式サポート Chrome57で正式サポート IUUQTFOXJLJQFEJBPSHXJLJ(PPHMF@$ISPNFNFEJB'JMF(PPHMF@$ISPNF@GPS@"OESPJE@*DPO@TWH IUUQTDPNNPOTXJLJNFEJBPSHXJLJ'JMF.JDSPTPGU@&EHF@MPHPTWH IUUQTFOXJLJQFEJBPSHXJLJ8FC,JU 開発中 https://webkit.org/status/#specification-webassembly AngryBotsの動作デモ動画が
公開済み https://blogs.windows.com/msedgedev/2016/03/15/ previewing-webassembly-experiments
• 型付きスタックマシンの提供する命令で 関数を定義します • 利用できるデータ型: i32, i64, f32, f64 •
関数本体は抽象構文木として、 code section に記述されます • type section には、関数のシグネチャが 記述されます WASMはモジュールを定義します IUUQTSTNTNFXBTNJOUSP
• a = 1 + 2 * 3 は、 このように表現されます
• スタックマシンの命令 • set_local • i32.add • i32.mul • i32.const WASMで定義される抽象構文木
FNDDPJOEFYIUNMT8"4.IFMMPD
項目 Emscripten によるサポート 標準ライブラリ (libc / libc++) Emscriptenがlibc/libc++をコンパイルしてリンク リンク static
link / dynamic link ファイルシステム POSIX ファイルシステムをエミュレート アセット JSに埋め込み / XHRへ変換 OpenGL WebGLに変換
Emscripten の提供するファイルシステム • MEMFS が標準のファイルシステムです • 他のファイルシステムは、mount して利用します "QQ MJCD
MJCD "TZODISPOPVT'JMF4ZTUFN "1* FNTDSJQUFOI 4ZODISPOPVT'JMF4ZTUFN"1* MJCSBSZ@GTKT 803,&3'4 /0%&'4 *%#'4 .&.'4
WPJEDBU '*-& GJMF \ MPOHTJ[F DIBS CVG GTFFL GJMF
4&&,@&/% TJ[FGUFMM GJMF CVG DIBS NBMMPD TJ[F TJ[FPG DIBS NFNTFU CVG = TJ[F GTFFL GJMF 4&&,@4&5 GSFBE CVG TJ[FPG DIBS TJ[F GJMF QSJOUG T CVG GSFF CVG ^ このコードはそのまま動きます
'*-& GJMF GJMFGPQFO GJMFOBNF B GXSJUF NFTTBHF TJ[FPG
DIBS TUSMFO NFTTBHF GJMF GQVUD =O GJMF GDMPTF GJMF このコードもそのまま動きます
͉̭̭QSPD ̯͉̭̭TFMG ̯̯͉̭̭GE ͉̭̭EFW ̯͉̭̭TUEFSS ̯͉̭̭TUEPVU ̯͉̭̭TUEJO ̯͉̭̭TIN ̯̯͉̭̭UNQ
̯͉̭̭VSBOEPN ̯͉̭̭SBOEPN ̯͉̭̭UUZ ̯͉̭̭UUZ ̯͉̭̭OVMM ͉̭̭IPNF ̯͉̭̭XFC@VTFS ͉̭̭UNQ 初期のディレクトリレイアウト • /dev や /proc があるのも興味深いです • /dev/random や /dev/null も実装されています • これらのデバイスファイルを読み書きできます • 初期のカレントディレクトリは / (ルートディレクトリ) • FS モジュールのメソッドで JavaScript からもアクセスできます
%#@/".& &SSOP&SSPS '4/PEF '44USFBN BCTPMVUF1BUI BMMPDBUF BOBMZ[F1BUI DIEJS DINPE DIPXO
DMPTF DMPTF4USFBN DSFBUF DSFBUF%BUB'JMF DSFBUF%FGBVMU%F WJDFT DSFBUF%FGBVMU%J SFDUPSJFT DSFBUF%FWJDF DSFBUF'JMF DSFBUF'PMEFS DSFBUF-B[Z'JMF DSFBUF-JOL DSFBUF/PEF DSFBUF1BUI DSFBUF1SFMPBEFE 'JMF DSFBUF4QFDJBM%J SFDUPSJFT DSFBUF4UBOEBSE4 USFBNT DSFBUF4USFBN DXE EFTUSPZ/PEF FOTVSF&SSOP&SSPS GDINPE GDIPXO GJOE0CKFDU GMBHT5P1FSNJTTJ PO4USJOH GPSDF-PBE'JMF GUSVODBUF HFU%FWJDF HFU.PEF HFU.PVOUT HFU1BUI HFU4USFBN IBOEMF'4&SSPS IBTI"EE/PEF IBTI/BNF IBTI3FNPWF/PEF JOEFYFE%# JOJU JPDUM JT#MLEFW JT$ISEFW JT%JS JT'*'0 JT'JMF JT-JOL JT.PVOUQPJOU JT3PPU JT4PDLFU KPJO1BUI MDINPE MDIPXO MMTFFL MPBE'JMFT'SPN%# MPPLVQ MPPLVQ/PEF MPPLVQ1BUI MTUBU NBKPS NBLFEFW NBZ$SFBUF NBZ%FMFUF NBZ-PPLVQ NBZ0QFO NJOPS NLEFW NLEJS NLEJS5SFF NLOPE NNBQ NPEF4USJOH5P'MBHT NPVOU NTZOD NVONBQ OFYUGE OPEF1FSNJTTJPOT PQFO RVJU SFBE SFBE'JMF SFBEEJS SFBEMJOL SFHJTUFS%FWJDF SFOBNF SNEJS TBWF'JMFT5P%# TUBOEBSEJ[F1BUI TUBU TUBUJD*OJU TZNMJOL TZODGT USVODBUF VOMJOL VONPVOU VUJNF XSJUF XSJUF'JMF library_fs.js:同期的なファイルシステムAPI
FNDDT'03$&@'*-&4:45&.IFMMPD লटӘԟԡԮՈԛդՓҶහӚӶӐҮӔҮ൶ѬԽԉԌՓԟԡԮՈӘᮿ⥎ӼुѰథ㖭ӁӨӃ㮴 գDMPTF գJPDUM գMMTFFL գXSJUFW ҽӶӳӼ⽠ӽӑҮӔҮ൶ӑӬѬԛ՛ԹԌՑԒԿԟՏ՛ӕ T'03$&@'*-&4:45&. ӼӎһӵӒԽԉԌՓԟԡԮՈӼఐ⇹ӑҷӨӃѭ タイトル
利用できるファイルシステム ファイルシステム 特徴 MEMFS メモリ上にファイルを作成します。標準のファイルシステムです。 IDBFS IndexedDB にファイルを格納します。不揮発性です。ブラウザ専用です。 NODEFS Node.js
の提供するファイルシステムAPIを利用します。Node.js専用です。 WORKERFS Blobやファイルをマウントできます。リードオンリーファイルシステムです。
'4NLEJS NPVOU '4NPVOU .&.'4 \^ NPVOU գᙨ㛈㮴 ՆԎ՛ՅԌ՛ӒӔӵԯԋՔԗՒӼਃᘻӁӨӃ
ԽԉԌՓԟԡԮՈӼᛡᇰӁӐՆԎ՛ӁӨӃѭ գ'4NPVOU GT5ZQF PQUJPO NPVOU1PJOU GT5ZQFӕә.&.'4Ѭ*%#'4Ѭ/%0&'4Ѭ803,&3'4ӘҮӄӶҵӼᛡᇰӁӨӃ ԒԿԟՏ՛ӕᛡᇰӃӵԒԾԠԏԗәѬԽԉԌՓԟԡԮՈҾӒӕ∳ӔӴӨӃ ファイルシステムのマウント方法
FNDDPJOEFYIUNMQPTUKTNPVOUKTIFMMPD QPTUKTԒԿԟՏ՛ӑᛡᇰӁӉ+4ҶѬ գՊԠՍդՓӘՕդԱᒁӑѬ գӁҵӬNBJOҶシӵనӕ ᇴҿӶӨӃѭゼಌᣪҵӳՆԎ՛ӼҰӔӳѬҽҽӑⅈӼᥨҹҽӒӕӔӴӨӃѭ 起動時にファイルシステムをマウントさせるには、--post-jsで指定したJSでマウント処理を行います
IDBFS:syncfsインタフェースを実装したMEMFS 名前 値 /idbfs/readme.txt {"timestamp":"2017-02-02T08:50:56.765", mode: 33206, contents: {...}} /idbfs/sub/hello.c
{"timestamp":"2017-02-02T08:50:56.765", mode: 33206, contents: {...}} /idbfs/main.c {"timestamp":"2017-02-02T08:50:56.765", mode: 33206, contents: {...}} /idbfs/sub/log.c {"timestamp":"2017-02-02T08:50:56.765", mode: 33206, contents: {...}} SFBENFUYU TVC IFMMPD MPHD '4TZODGT USVF '4TZODGT GBMTF
'4NLEJS JECGT '4NPVOU *%#'4 \^ JECGT '4TZODGT USVF
FSSPS\ JG FSSPS \ .PEVMFQSJOU FSSPS SFUVSO ^ DPOTUFOUSZ1PJOU.PEVMFDDBMM FOUSZ1PJOU <> FOUSZ1PJOU ^ IDBFSを使用するときの注意点その1:マウント後、syncfsが必要です
XJOEPXBEE&WFOU-JTUFOFS CFGPSFVOMPBE F\ '4TZODGT GBMTF FSSPS\JG FSSPS \ DPOTPMFFSSPS FSSPS
^ ^ ^ \PODFUSVF^ գ◌ᐠᡔӕGBMTFӼᛡᇰӃӵӒѬ*OEFYFE%#ӕᥨҷᙛӁӨӃ IDBFSを使用するときの注意点その2: beforeunload イベント発火時に FS.syncfsを呼ぶ必要があります
'*-& GJMFGPQFO JECGTTPNFGJMFUYU DIBS NTH)FMMP XPSME GXSJUF NTH TJ[FPG
DIBS TUSMFO NTH GJMF TZOD ҽӶӑ*OEFYFE%#ӢӘᥨҷᙛӁҶӹӶӨӃ GDMPTF GJMF IDBFSを使うときの注意点その3:明示的にsyncを読んで、write-troughにしておきましょう
マウントポイントの名前でDBを作ります
libc / libc++ を使ったファイルアクセスのまとめ • 標準入出力関数は、そのまま使えます • 同期的に呼び出せます • Emscripten
が適切に変換を行います • ファイル関係のシステムコールは library_fs.js 内の関数呼び出しになります • 使用できるファイルシステムは 4 種類 • ブラウザ上にデータを保存するなら IDBFS を使用します • IDBFS は事前にマウントする必要があります • 適切なタイミングで、ファイルシステムとIndexedDBの同期を行う必要があります
emscripten.h 内に定義されている非同期ファイル処理関数 • emscripten_async_wget • emscripten_async_wget_data • emscripten_async_wget2 • emscripten_async_wget2_data
• emscripten_async_wget2_abort
'4SFHJTUFS%FWJDF '4NBLFEFW \ SFBEGVODUJPO \SFUVSO^ XSJUFGVODUJPO TUSFBN
CVGGFS PGGTFU MFOHUI QPT \ SFUVSOMFOHUI ^ ^ '4NLEFW EFWOVMM '4NBLFEFW 特殊ファイルの作成
WBSSBOEPN@EFWJDF JG UZQFPGDSZQUPVOEFGJOFE \ WBSSBOEPN#VGGFSOFX6JOU"SSBZ SBOEPN@EFWJDFGVODUJPO \ DSZQUPHFU3BOEPN7BMVFT
SBOEPN#VGGFS SFUVSOSBOEPN#VGGFS<> ^ ^FMTFJG &/7*30/.&/5@*4@/0%& \ SBOEPN@EFWJDFGVODUJPO \SFUVSOSFRVJSF DSZQUP SBOEPN#ZUFT <>^ ^FMTF\ SBOEPN@EFWJDFGVODUJPO \SFUVSO .BUISBOEPN ]^ ^ '4DSFBUF%FWJDF EFW SBOEPN SBOEPN@EFWJDF /dev/random の実装