ウェブページに表示されているウィンドウにランダムな数字を入力したいと思います。私は現在、これを行うにしようとしています方法は、最初のランダムな数字の長い文字列が含まれ、その後、divの上で、次のプロパティを使用して：ランダムな数字のブラウザウィンドウを入力してください
#mydiv{
font-family: "Inconsolata", monospace;
word-break: break-all;
font-size: 3em;
color: #202020;
height: 100%;
width: 100%;
overflow-y:hidden;
}
https://jsfiddle.net/4ztpbnm0/1/
それは（ISH）の作品クローム上、それブラウザウィンドウのサイズを変更した後、非常に目立つ時間をかけてリフローします。これをシームレスにする方法はありますか？
利用overflow-wrap: break-wordの代わりword-break: break-all。
https://jsfiddle.net/746g71wb/
word-wrapは最近、あなたは両方を指定したい場合があり、他のブラウザをサポートするために、overflow-wrapに名前が変更されました：
word-wrap: break-word;
overflow-wrap: break-word;
おそらく関連するクロームのバグ：https://bugs.chromium.org/p/chromium/issues/detail?id=591793
文字列を連結する代わりに、配列を使用します。はるかに高速です。
bgtext = [];
for (var i = 0; i < 173; ++i) {
bgtext.push(Math.random() < 0.5 ? '1' : '0');
}
for (var i = 0; i < 6; ++i) {
bgtext.push(bgtext.join(''))
};
function loadbg() {
\t bgtext = bgtext.join('');
document.getElementById('background').innerHTML = bgtext;
}
loadbg();<body>
<div id="background">
</div>
</body>これはロードが少し速くなることを知っていますが、これは私が心配していることではありません。サイズ変更はまだ非常に遅いです。 –
違いはありません。問題は生成中ではなく、サイズ変更時にビューを再レンダリングしている間です。 jsコードはここでは実行されません。 –
私はSVGを使用することをお勧め背景画像（all current browsersでサポート）。あなたはそれが説得力に見えるように好きなようにあなたはSVGタイルになど多くの「ランダム」の数字を追加することができます。
body {
background-color: black;
background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' version='1.1' height='400px' width='385px'><text x='0' y='0' font-size='40px' font-family='monospace' fill='%23202020'><tspan x='0' dy='40px'>0011010101010100</tspan><tspan x='0' dy='40px'>0101001010100101</tspan><tspan x='0' dy='40px'>1010101000010001</tspan><tspan x='0' dy='40px'>0101010101000100</tspan><tspan x='0' dy='40px'>0010110101010101</tspan><tspan x='0' dy='40px'>0101000010101010</tspan><tspan x='0' dy='40px'>1010101101110101</tspan><tspan x='0' dy='40px'>1010010010010110</tspan><tspan x='0' dy='40px'>0100110101010101</tspan><tspan x='0' dy='40px'>1011100010111001</tspan></text></svg>");
}その性能はさらに〜8歳のラップトップ上で、超高速です。ランダム性が深刻な場合は、JavaScript経由でSVGを生成し、完全にランダムな数字で埋めてください。
を参照してください「が、それは、ブラウザウィンドウのサイズを変更した後リフローする時間の非常に顕著量を要する。これはシームレスにする方法はありますか？」 - あなたが提供したjsfiddleのサイズを変更している間に気付かなかった。 – nicael
最後の文字列の長さが173 * 6ではなく、「11072」であることに気付きましたか？ –
@nicaelでは、この再レンダリングフリーズは、水平方向のサイズ変更でのみ表示されました。 –