{"id":773,"date":"2019-04-25T19:27:40","date_gmt":"2019-04-25T19:27:40","guid":{"rendered":"http:\/\/www.smart-bricks.net\/?p=773"},"modified":"2019-04-28T22:23:11","modified_gmt":"2019-04-28T22:23:11","slug":"google-experiments-with-key-value-storage-built-in-modules-in-chrome-74","status":"publish","type":"post","link":"http:\/\/www.smart-bricks.net\/index.php\/2019\/04\/25\/google-experiments-with-key-value-storage-built-in-modules-in-chrome-74\/","title":{"rendered":"Google Experiments with Key-Value Storage, Built-In Modules in Chrome 74"},"content":{"rendered":"\n

Google recently announced its intent to ship<\/a> two new WICG<\/a> proposals in a future version of Chrome. KV Storage<\/a>\n (Key-Value storage) attempts to bring the convenience of LocalStorage \nbut with better performance. The intent is to deliver this as the first \nexample of a built-in module, leveraging the import maps proposal<\/a>.<\/p>\n\n\n\n

The JavaScript ecosystem has had a somewhat fractured approach to \nstoring and caching data locally. As explained by Philip Walton, a \nsoftware engineer at Google working on the Web Platform,<\/p>\n\n\n\n

Browser vendors and web performance experts have been saying for the better part of the last decade that localStorage\n is slow, and web developers should stop using it. To be fair, the \npeople saying this are not wrong. localStorage is a synchronous API that\n blocks the main thread, and any time you access it you potentially \nprevent your page from being interactive. The problem is the \nlocalStorage API is just so temptingly simple, and the only asynchronous\n alternative to localStorage is IndexedDB, which (let’s face it) is not \nknown for its ease of use or welcoming API.<\/p><\/blockquote>\n\n\n\n

The Web Incubator CG (WICG) recently promoted KV Storage to be part of the W3C IndexedDB specification. KV Storage similar to localStorage\n in utility, but more modern and gets layered on top of IndexedDB. The \nspecification mandates that it gets implemented by browser vendors as a \nbuilt-in module, and use IndexedDB as its backing store.<\/p>\n\n\n\n

Example usage of the KV Storage API as provided by the specification:<\/p>\n\n\n\n

import { storage } from \"std:kv-storage\"; \/\/ specifier prefix not final\n\n(async () => {\n  await storage.set(\"mycat\", \"Tom\");\n  console.assert(await storage.get(\"mycat\") === \"Tom\");\n\n  for await (const [key, value] of storage.entries()) {\n    console.log(key, value);\n  }\n  \/\/ Logs \"mycat\", \"Tom\"\n\n  await storage.delete(\"mycat\");\n  console.assert(await storage.get(\"mycat\") === undefined);\n})();<\/code><\/pre>\n\n\n\n
A KV Storage polyfill<\/a> exists for browsers which support IndexedDB.<\/p>\n\n\n\n
The KV Storage module gets resolved as defined in the JavaScript Standard Library initiative<\/a> and its support for import maps.<\/p>\n\n\n\n
Import maps are not a new concept, and were part of earlier \nJavaScript module systems, such as AMD and module systems in other \nprogramming languages. Their inclusion with standard ES Modules is new. \nThis import maps proposal provides control over the URLs getting fetched\n by JavaScript import statements and import() expressions, and \nallows the mapping to get reused in non-import contexts. Import maps \nallow for simplified import statements, fallback module resolutions, \npolyfills for built-in modules, and sharing of contexts between fetch, \nimage and link tags, and more.<\/p>\n\n\n\n
Successful implementation of these two new highly anticipated \nfeatures should significantly improve the process by which features get \nadded to future versions of JavaScript and to provide additional \nconvenient web APIs. Import maps and built-in modules strive to solve a \nmissing piece of the extensible web manifesto<\/a>.<\/p>\n\n\n\n
Developers looking to experiment today with KV Storage may leverage \nthe polyfill, or install a Chrome Dev or Canary version of Chrome 74. \nBefore the mainstream release of these features, developers can make \nthese features available to all Chrome 74+ users for specific domains by\n registering interest in the KV Storage origin trial<\/a>.<\/p>\n","protected":false},"excerpt":{"rendered":"
Google recently announced its intent to ship two new WICG proposals in a future version of Chrome. KV Storage (Key-Value storage) attempts to bring the convenience of LocalStorage but with better performance. The intent is to deliver this as the first example of a built-in module, leveraging the import maps proposal. The JavaScript ecosystem has… Read More »Google Experiments with Key-Value Storage, Built-In Modules in Chrome 74<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[1],"tags":[14,26,25],"_links":{"self":[{"href":"http:\/\/www.smart-bricks.net\/index.php\/wp-json\/wp\/v2\/posts\/773"}],"collection":[{"href":"http:\/\/www.smart-bricks.net\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/www.smart-bricks.net\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/www.smart-bricks.net\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/www.smart-bricks.net\/index.php\/wp-json\/wp\/v2\/comments?post=773"}],"version-history":[{"count":1,"href":"http:\/\/www.smart-bricks.net\/index.php\/wp-json\/wp\/v2\/posts\/773\/revisions"}],"predecessor-version":[{"id":774,"href":"http:\/\/www.smart-bricks.net\/index.php\/wp-json\/wp\/v2\/posts\/773\/revisions\/774"}],"wp:attachment":[{"href":"http:\/\/www.smart-bricks.net\/index.php\/wp-json\/wp\/v2\/media?parent=773"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/www.smart-bricks.net\/index.php\/wp-json\/wp\/v2\/categories?post=773"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/www.smart-bricks.net\/index.php\/wp-json\/wp\/v2\/tags?post=773"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}