Qiita Teams that are logged in
You are not logged in to any team

Log in to Qiita Team
Community
OrganizationAdvent CalendarQiitadon (β)
Service
Qiita JobsQiita ZineQiita Blog
Help us understand the problem. What is going on with this article?

ブラウザ上でzipファイルを圧縮展開できるWebアプリを作ってみた

こんにちわ。

創作意欲が湧いた勢いで、JavaScriptからzip形式のアーカイブを操作できる "JSZip" というライブラリを使用して、ブラウザ上でzipを圧縮展開できる簡単なWebアプリを作ってみました。

作ったもの

めちゃくちゃシンプルです。

Babelは通してないので、動作確認済のChrome以外は新生EdgeやFirefoxでなら多分動くと思います。

仕組み

凝ったことはしていないので、とても簡単です。

  1. Input要素でファイルを読込
  2. ファイルをワーカースレッドへ転送
  3. ワーカースレッドでJSZipをロードし圧縮展開
  4. 処理結果をメインスレッドへ転送
  5. a要素に処理結果のBlobURLを充ててダウンロード

全ての処理がローカルで完結しています。

ヘビータスクの圧縮展開はWebWorkerで処理しており、かつファイルはTypedArray化して参照渡し(Transferable Object)しているので、処理中の描画レスポンスへの影響はほとんどありません。

dojyorin
独学でJavaScriptとC++やってます。
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away