From 5c6a3f003fcce85de31ebcbb1a6dd26b244c4a03 Mon Sep 17 00:00:00 2001 From: Ilya Kantor Date: Sun, 19 May 2019 23:05:25 +0300 Subject: [PATCH] fixes --- .../08-settimeout-setinterval/article.md | 10 +++++----- 6-data-storage/02-localstorage/article.md | 12 +++++++----- 2 files changed, 12 insertions(+), 10 deletions(-) diff --git a/1-js/06-advanced-functions/08-settimeout-setinterval/article.md b/1-js/06-advanced-functions/08-settimeout-setinterval/article.md index 9fe9ceef..2ff7d6dc 100644 --- a/1-js/06-advanced-functions/08-settimeout-setinterval/article.md +++ b/1-js/06-advanced-functions/08-settimeout-setinterval/article.md @@ -387,9 +387,9 @@ For server-side JavaScript, that limitation does not exist, and there exist othe ### Allowing the browser to render -Another benefit for in-browser scripts is that they can show a progress bar or something to the user. That's because the browser usually does all "repainting" after the script is complete. +Another benefit of splitting heavy tasks for browser scripts is that we can show a progress bar or something to the user. -So if we do a single huge function then even if it changes something, the changes are not reflected in the document till it finishes. +Usually the browser does all "repainting" after the currently running code is complete. So if we do a single huge function that changes many elements, the changes are not painted out till it finishes. Here's the demo: ```html run @@ -402,7 +402,7 @@ Here's the demo: for (let j = 0; j < 1e6; j++) { i++; // put the current i into the
- // (we'll talk more about innerHTML in the specific chapter, should be obvious here) + // (we'll talk about innerHTML in the specific chapter, it just writes into element here) progress.innerHTML = i; } } @@ -446,9 +446,9 @@ Now the `
` shows increasing values of `i`. - Methods `setInterval(func, delay, ...args)` and `setTimeout(func, delay, ...args)` allow to run the `func` regularly/once after `delay` milliseconds. - To cancel the execution, we should call `clearInterval/clearTimeout` with the value returned by `setInterval/setTimeout`. - Nested `setTimeout` calls is a more flexible alternative to `setInterval`. Also they can guarantee the minimal time *between* the executions. -- Zero-timeout scheduling `setTimeout(...,0)` is used to schedule the call "as soon as possible, but after the current code is complete". +- Zero-timeout scheduling `setTimeout(func, 0)` (the same as `setTimeout(func)`) is used to schedule the call "as soon as possible, but after the current code is complete". -Some use cases of `setTimeout(...,0)`: +Some use cases of `setTimeout(func)`: - To split CPU-hungry tasks into pieces, so that the script doesn't "hang" - To let the browser do something else while the process is going on (paint the progress bar). diff --git a/6-data-storage/02-localstorage/article.md b/6-data-storage/02-localstorage/article.md index 62e0226c..ec3c0e64 100644 --- a/6-data-storage/02-localstorage/article.md +++ b/6-data-storage/02-localstorage/article.md @@ -7,7 +7,7 @@ What's interesting about them is that the data survives a page refresh (for `ses We already have cookies. Why additional objects? - Unlike cookies, web storage objects are not sent to server with each request. Because of that, we can store much more. Most browsers allow at least 2 megabytes of data (or more) and have settings to configure that. -- The server can't manipulate storage objects via HTTP headers, everything's done in JavaScript. +- Also unlike cookies, the server can't manipulate storage objects via HTTP headers. Everything's done in JavaScript. - The storage is bound to the origin (domain/protocol/port triplet). That is, different protocols or subdomains infer different storage objects, they can't access data from each other. Both storage objects provide same methods and properties: @@ -19,6 +19,8 @@ Both storage objects provide same methods and properties: - `key(index)` -- get the key on a given position. - `length` -- the number of stored items. +As you can see, it's like a `Map` colection (`setItem/getItem/removeItem`), but also keeps elements order and allows to access by index with `key(index)`. + Let's see how it works. ## localStorage demo @@ -71,11 +73,11 @@ That's allowed for historical reasons, and mostly works, but generally not recom ## Looping over keys -Methods provide get/set/remove functionality. But how to get all the keys? +As we've seen, the methods provide get/set/remove functionality. But how to get all saved values or keys? Unfortunately, storage objects are not iterable. -One way is to use "array-like" iteration: +One way is to loop over them as over an array: ```js run for(let i=0; i