Vydělávej až 160.000 Kč měsíčně! Akreditované rekvalifikační kurzy s garancí práce od 0 Kč. Více informací.
Hledáme nové posily do ITnetwork týmu. Podívej se na volné pozice a přidej se do nejagilnější firmy na trhu - Více informací.
Avatar
vencator
Člen
Avatar
vencator:8.2.2017 21:42

Zdravím, píšu první dotaz do fóra, tak snad jsem něco neopomněl :)

Mám program, kde zadáte číslo a program zobrazí všechna prvočísla do zadaného čísla.

Jelikož při větších číslech to docela trvá, tak bych chtěl uživatele během počítání informovat v jaké je to fázi.

Když použiji <code>console­.log("Computing prime numbers...");</co­de> ,tak se to v konzoli zobrazí okamžitě. Což je super.

Když však chci použít <code>info[0]­.textContent = "Computing prime numbers...";</co­de>, tak se to v paragrafu zobrazí až po dokončení funkce. Což není super.

info[0] je první <p id="info"></p>

Dotaz zní, jak mám kód, co mění textContent donutit, aby ho změnil okamžitě?

input.addEventListener("change", function(){
    reset();
    var startTime = new Date();
    userNumber = Number(input.value);
    if(userNumber <= 200000) {
       info[0].textContent = "Computing prime numbers..."; //zde je problém
       console.log("Computing prime numbers..."); //zde není problém
       step1();
       step2();
       step3();
       step4();
       info[0].textContent += " Done!"; //zde je problém
       console.log("Done!"); //zde není problém
       primes = primes.concat(numbers);
       var endTime = new Date();
       info[1].textContent = "Creating a results table..."; //zde je problém
       console.log("Creating a results table..."); //zde není problém
       resultTable();
       printResult();
       info[1].textContent += " Done!";
       console.log("Done!");
       var endTime2 = new Date();
       info[2].textContent = cycles + " cycles needed to generate "+ primes.length +" primes at time " + (endTime - startTime) + "ms";
       console.log(cycles + " cycles needed to generate "+ primes.length +" primes at time " + (endTime - startTime) + "ms");
       info[3].textContent = "Table generates in " + (endTime2 - endTime) + "ms";
       console.log("Table generates in " + (endTime2 - endTime) + "ms");
   } else alert("Your number is too high! Moron!");
});

Celý kód zde: https://jsfiddle.net/…or/byde5rxe/

Editováno 8.2.2017 21:43
 
Odpovědět
8.2.2017 21:42
Avatar
David Hynek
Tvůrce
Avatar
David Hynek:8.2.2017 22:18

tak to oznámení udělej jako nezávislou funkci. Funkce co bude počítat, tak mění nějakou hodnotu a ta první funkce počká až bude hodnota tak akorát a spustí oznámení...

Nahoru Odpovědět
8.2.2017 22:18
Čím víc vím, tím víc věcí nevím.
Avatar
Odpovídá na David Hynek
Neaktivní uživatel:9.2.2017 17:53

To tady nepomuze problem je v zasade v tom, ze operace vypoctu je hodne heavy a zatizi hlavni vlakno aplikace natolik, ze se UI neupdatuje, prestava byt responzivni. viz tenhle fiddle https://jsfiddle.net/…ll/wyp845e2/ ... dlouho nic a pak sword-fish

vencator

V JSku se tenhle problem resi dvema zpusoby: budto prepises svuj algoritmus na tzv. iterativni reseni - to znamena, ze ho napises tak, aby bezel priblizne takhle:

zacne se pocitat -> nastavi se timeout na (napriklad) 30 ms a spocita se kousek, stav se ulozi -> nastavi se timeout na 30 ms a to je vse -> zase se kousek spocita, a stav ulozi, pak se nastavi timeout atd atd atd

druha moznost jsou web workery, sam jsem pred casem napsal knihovnu, ktera umoznuje snazsi praci s touhle technologii, kterou disponuji snad vsechny dnesni browsery, tahle technologie ti umoznuje pocitat v jinem vlakne, tedy vsechny vypocty se provadeji na pozadi a az se dopocita, posles si do hlavni kontextu zpravu a vysledek zobrazis, tvoje UI je mezitim naprosto responzivni

https://github.com/…ill/async.js
https://developer.mozilla.org/…_web_workers
https://benjaminhorn.io/…ngle-thread/

v tomhle vlaknu na SO se k tomu vyjadrujou stejne jako ja
http://stackoverflow.com/…n-javascript

hodne stesti :) tohle je docela zabavna oblast

Akceptované řešení
+20 Zkušeností
+2,50 Kč
Řešení problému
Nahoru Odpovědět
9.2.2017 17:53
Neaktivní uživatelský účet
Avatar
Aleš Lulák
Člen
Avatar
Odpovídá na Neaktivní uživatel
Aleš Lulák:10.2.2017 8:05

Jen dodám, že to může být i 0 ms, ono se to s nulou stejně odloží tak i tak až na konec , ale spustí ihned, co bude moci.

Nahoru Odpovědět
10.2.2017 8:05
"I disapprove of what you say, but I will defend to the death your right to say it" - Evelyn Beatrice Hall
Avatar
Odpovídá na Aleš Lulák
Neaktivní uživatel:10.2.2017 10:45

Když jsi to zmínil, pamatuju, že IEcko na 0 nespustilo kód vůbec, už je to v pohodě?

Nahoru Odpovědět
10.2.2017 10:45
Neaktivní uživatelský účet
Avatar
Odpovídá na Neaktivní uživatel
Neaktivní uživatel:10.2.2017 16:29

Ano, protože IE už nikoho moc netrápí :D

Nahoru Odpovědět
10.2.2017 16:29
Neaktivní uživatelský účet
Avatar
Odpovídá na Neaktivní uživatel
Libor Šimo (libcosenior):10.2.2017 16:35

Asi by si bol prekvapeny kolki zamestnanci este IE pouzivaju, dokonca pod winXP, pretoze musia.
A pritom je to hruza.

Nahoru Odpovědět
10.2.2017 16:35
Aj tisícmíľová cesta musí začať jednoduchým krokom.
Avatar
vencator
Člen
Avatar
Odpovídá na Neaktivní uživatel
vencator:11.2.2017 5:51

Sice nevím, jestli jsem vše pochopil, páč jsem úplnej začátečník, ale každopádně mě ty timeouty i dát oznámení jako funkci inspirovaly. A nyní to asi po tisíci různých pokusech tak nějak funguje :)

Takže všem děkuji za rady.

 
Nahoru Odpovědět
11.2.2017 5:51
Avatar
Odpovídá na Libor Šimo (libcosenior)
Neaktivní uživatel:11.2.2017 17:14

Nebyl bych překvapený, šestka a sedmička dohromady nemají ani procento. S osmičkou už nejsou takové problémy a od desítky je to podle mého relativně použitelný prohlížeč. Ale pokud lidem s IE budou weby v IE fungovat i nadále, pak nebudou mít nikdy důvod upgradovat na solidní prohlížeč.

Nahoru Odpovědět
11.2.2017 17:14
Neaktivní uživatelský účet
Děláme co je v našich silách, aby byly zdejší diskuze co nejkvalitnější. Proto do nich také mohou přispívat pouze registrovaní členové. Pro zapojení do diskuze se přihlas. Pokud ještě nemáš účet, zaregistruj se, je to zdarma.

Zobrazeno 9 zpráv z 9.