質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

Q&A

解決済

1回答

2570閲覧

JSZipで圧縮中に別タブへ切り替えても処理を続行したい

bsk

総合スコア174

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

0グッド

1クリップ

投稿2019/08/17 13:45

実現したいこと

実行環境:Chrome: 76.0.3809.100、Tampermonkey 4.8.41
Tampermonkeyでのユーザースクリプトを作成中です。
JSzipでファイルを圧縮、ダウンロードする処理を作成しています。
ファイルのzip化、保存は可能になったのですがファイル圧縮中に別のタブへ切り替えると処理が一時停止します。
タブをフォーカスし直すと処理が続行され通常処理になります。
これをタブを切り替えても処理を背面で続行するようにしたいです。

発生している問題

別タブへ切り替えると処理が一時停止する。

該当のソースコード

デモ用のTampermonkeyのソースコードとなります。
下記サイトで実行されます。
https://stuk.github.io/jszip/
左上のDLボタンをクリックすると10MB程度のテキストファイルを作成しzip化しファイルをダウンロードします。
左上のボタンに圧縮中の進捗が表示されます。

javascript

1// ==UserScript== 2// @name js_zip_demo 3// @namespace js_zip_demo 4// @description js_zip_demo 5// @include https://stuk.github.io/jszip/ 6// @version 1 7// @grant none 8// @require http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js 9// @require https://cdnjs.cloudflare.com/ajax/libs/jszip/3.2.0/jszip.js 10// @require https://cdnjs.cloudflare.com/ajax/libs/FileSaver.js/1.3.8/FileSaver.js 11// ==/UserScript== 12 13 14function savezip() { 15 var zip = new JSZip(); 16 17/////////適当なデータ生成 start 18 var c = "abcdefghijklmnopqrstuvwxyz0123456789"; 19 var r = ""; 20 for(var i=0; i<10**5; i++){ 21 r += c[Math.floor(Math.random()*c.length)]; 22 } 23 for(var j=0; j<100; j++){ 24 zip.file(j+".txt",r); 25 } 26/////////適当なデータ生成 end 27 28 zip.generateAsync({type:"blob"}, function updateCallback(metadata){ //ファイルzip化 29 document.getElementById("js_zip_button").textContent="圧縮中:"+ Math.round(metadata.percent.toFixed(2)) + "%";//進捗表示 30 console.log(Math.round(metadata.percent.toFixed(2))); 31 }) 32 .then(function(content) { 33 saveAs(content, "example.zip");//ファイル保存 34 document.getElementById("js_zip_button").textContent="完了"; 35 }); 36 37} 38 39jQuery('body').prepend('<button id="js_zip_button"" >DL</button>'); //ページ左上にボタン作成 40jQuery("#js_zip_button").click(function(){savezip();});

試したこと

firefoxのGreasemonkeyでも動作テストを行いましたが同じ症状が発生します。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

ベストアンサー

バックグラウンドタブは省電力などの理由のため制限が加わります。
setTimeout() による遅延が Chrome、Firefox いずれも 1000ms 以上になるようです。
https://developer.mozilla.org/ja/docs/Web/API/WindowTimers/setTimeout#Reasons_for_delays_longer_than_specified
https://docs.google.com/document/d/18_sX-KGRaHcV3xe5Xk_l6NNwXoxm-23IOepgMx4OlE4/pub

提示コードでさえ jszip で setTimeout() が800回以上呼ばれているようですので、最低でも800秒以上かかることになります。
Chrome / Firefox で <audio> 要素で再生することで回避できることを確認しましたが、本末転倒のような気がします。

投稿2019/08/21 05:11

x_x

総合スコア13749

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

bsk

2019/08/21 08:59 編集

ブラウザ側の制限とは驚きです。アクティブでも4ms制限、バックグラウンドだと1000msも制限しているとは・・・。試しにfirefoxのdom.min_timeout_valueとdom.min_background_timeout_valueの値を0にしてみると圧縮速度が爆速になりバックグラウンドでも動作可能でした。 圧縮が遅かったのも4msの制限のせいだったみたいです。 最終的な対応策は検討が必要ですが原因がわかり助かりました。 ありがとうございます。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問