Atomics and SharedArrayBuffer 744
SharedArrayBuffer 744
Atomics Basics 745
 Atomic Arithmetic and Bitwise Methods 745
 Atomic Reads and Writes 747
 Atomic Exchanges 748
 Atomics Futex Operations and Locks 749
Cross-Context Messaging 751
Encoding API 753
Encoding Text 753
 Bulk Encoding 753
 Stream Encoding 754
Decoding Text 755
 Bulk Decoding 755
 Stream Decoding 756
Blob and File APIs 758
The File Type 758
The FileReader Type 759
The FileReaderSync Type 761
Blobs and Partial Reads 761
Object URLs and Blobs 762
Drag-and-Drop File Reading 763
Media Elements 764
Properties 765
Events 767
Custom Media Players 768
Codec Support Detection 769
The Audio Type 770
Native Drag and Drop 770
Drag-and-Drop Events 770
Custom Drop Targets 771
The dataTransfer Object 772
dropEffect and effectAllowed 773
Draggability 774
Additional Members 774
Notifications API 775
Notification Permissions 775
Showing and Hiding Notification 775
Notification Lifecycle Callbacks 776
Page Visibility API 776
Streams API 777
Introduction to Streams 778
 Chunks, Internal Queues, and Backpressure 778
Readable Streams 779
 Using the ReadableStreamDefaultController 779
 Using the ReadableStreamDefaultReader 780
Writable Streams 781
 Creating a WriteableStream 781
 Using a WritableStreamDefaultWriter 781
Transform Streams 782
Piping Streams 784
Timing APIs 785
High Resolution Time API 786
Performance Timeline API 788
 User Timing API 788
 Navigation Timing API 789
 Resource Timing API 790
Web Components 791
HTML Templates 791
 Using a DocumentFragment 792
 Using <template> tags 793
 Template Scripts 794
Shadow DOM 795
 Introduction to Shadow DOM 795
 Creating a Shadow DOM 796
 Using a Shadow DOM 797
 Composition and Shadow DOM Slots 799
 Event Retargeting 801
Custom Elements 802
 Defining a Custom Element 802
 Adding Web Component Content 804
 Using Custom Element Lifecycle Hooks 805
 Reflecting Custom Element Attributes 806
 Upgrading Custom Elements 807
The Web Cryptography API 808
Random Number Generation 808
Using the SubtleCrypto Object 810
 Generating Cryptographic Digests 810
 CryptoKeys and Algorithms 812
 Generating CryptoKeys 814
 Exporting and Importing Keys 816
 Deriving Keys from Master Keys 817
 Signing and Verifying Messages with Asymmetric Keys 819
 Encrypting and Decrypting with Symmetric Keys 820
 Wrapping and Unwrapping a Key 821
Summary 822

-----------------------------------------

AtomicReadModifyWrite

Atomics.add(typedArray, index, increment);
compareExchange, load, store, add, sub, and,or, xor, exchange

-----------------------------------------

postMessage()

----------------------------------------

TextEncoder
encode encodeInto
TextDecoder
decode

---------------------------------------

FileReader

---------------------------------------

A “blob,” short for binary large object, is a JavaScript wrapper for immutable binary data.

--------------------------------------

window.URL.createObjectURL() 

window.URL.revokeObjectURL()

--------------------------------------

event.dataTransfer.files

--------------------------------------

let audio = new Audio("sound.mp3");

--------------------------------------

// working with text
event.dataTransfer.setData("text", "some text");

let text = event.dataTransfer.getData("text");

--------------------------------------

<!-- turn off dragging for this image -->
<img src="smile.gif" draggable="false" alt="Smiley face">
<!-- turn on dragging for this element -->
<div draggable="true">...</div>

-----------------------------------------

visibilitychange

-----------------------------------------

Notification.requestPermission()
 .then((permission) => {
  console.log('User responded to permission request:', permission);
 });

new Notification('Title text!', {
 body: 'Body text!',
 image: 'path/to/image.png',
 vibrate: true
});

const n = new Notification('I will close in 1000ms');
setTimeout(() => n.close(), 1000);

----------------------------------------

ReadableStream，WritableStream，TransformStream

----------------------------------------

window.performance.now()
performance.timeOrigin

performance.mark('foo');

performance.mark('foo');
for (let i = 0; i < 1E6; ++i) {}
performance.mark('bar');
performance.measure('baz', 'foo', 'bar');

----------------------------------------

const fooArray = new Uint8Array(2 ** 16);
console.log(window.crypto.getRandomValues(fooArray)); // Uint32Array(16384) [...]

---------------------------------------

(async function() {
 const params = {
  name: 'ECDSA',
  namedCurve: 'P-256'
 };
 const keyUsages = ['sign', 'verify'];
 const {publicKey, privateKey} = await crypto.subtle.generateKey(params, true, keyUsages);
 console.log(publicKey);
 // CryptoKey {type: "public", extractable: true, algorithm: {...}, usages: Array(1)}
 console.log(privateKey);
 // CryptoKey {type: "private", extractable: true, algorithm: {...}, usages: Array(1)}
})();