Кто-то на работе шутливо отправил электронное письмо с html файлом, предназначенным для разбивки вашего браузера, который был следующим
<html>
<script type="text/javascript">
function crash(){
for(i=0;i<5000000001;i++){
document.write(i);
}
}
</script>
<body onload="crash();">
</body>
</html>
В любом случае, это не очень хорошо работает в Chrome, и возник вопрос о том, что он создал дружеское соревнование, чтобы увидеть, кто может писать javascript, чтобы сделать страницу до 5 000 000 000 как можно быстрее, не заставляя браузер перестать отвечать на запросы или сбой.
Я придумал следующий фрагмент javascript, который предназначен для использования в Chrome.
<html>
<script type="text/javascript">
function countToFiveBillion(counter, num){
if(num < 5000000000)
{
num++;
if(num % 18700 == 0){
counter.innerHTML = num;
setTimeout(function() {countToFiveBillion(counter, num)}, 1);
} else {
countToFiveBillion(counter, num);
}
}
}
function initiateCountDown()
{
var counter = document.getElementById("counter");
var num = +counter.innerHTML;
countToFiveBillion(counter, num);
}
</script>
<body onload="initiateCountDown();">
<div id="counter">0</div>
</body>
</html>
Причина, по которой это будет выполняться только в chrome, заключается в том, что я использую вызов setTimeout
, чтобы избежать создания stackoverflow в chrome. (Chrome также позволяет вам получить самый большой стек для рекурсивных вызовов из всех браузеров).
Есть ли какой-нибудь способ ускорить этот подсчет? Я думаю, что я могу увеличить количество, подсчитанное немного, прежде чем оно вызовет переполнение (где-то менее 100). Единственное условие - это отобразить как можно больше чисел, поскольку оно подсчитывается.
Улучшенный код:
<html>
<script type="text/javascript">
var counter;
var num = 0;
function countToFiveBillion(){
if(num < 5000000000)
{
num++;
if(num % 18701 == 0){
setTimeout("countToFiveBillion()", 1);
counter.value = num;
} else {
countToFiveBillion();
}
} else {
counter.value = "number greater than 5 Billion";
}
}
function initiateCountDown()
{
counter = document.getElementById('counter');
countToFiveBillion();
}
</script>
<body onload="initiateCountDown();">
<input type="text" id="counter" value="0" />
</body>
</html>
- Сделано счет и элемент globabl
- Переключение на текстовый ввод вместо div
- изменил пользовательский интерфейс обновления после установки обратного вызова