jeena/en.javascript.info
1
0
Fork 0
Code Issues Pull requests Projects Packages Wiki Activity Actions

re-import images (Sketch update)

Browse source
This commit is contained in:
Ilya Kantor 2019-11-30 08:51:52 +03:00
parent 40e941e4e4
commit 4587fde235
65 changed files with 64 additions and 64 deletions
Download patch file Download diff file Expand all files Collapse all files

2
1-js/02-first-steps/11-logical-operators/9-check-login/ifelse_task.svg
View file

File diff suppressed because one or more lines are too long
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 6 KiB

After

Width:  |  Height:  |  Size: 6 KiB

Before After
Before After

2
1-js/03-code-quality/01-debugging-chrome/chrome-open-sources.svg
View file

File diff suppressed because one or more lines are too long
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 120 KiB

After

Width:  |  Height:  |  Size: 120 KiB

Before After
Before After

2
1-js/03-code-quality/01-debugging-chrome/chrome-sources-breakpoint.svg
View file

File diff suppressed because one or more lines are too long
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 140 KiB

After

Width:  |  Height:  |  Size: 140 KiB

Before After
Before After

2
1-js/03-code-quality/01-debugging-chrome/chrome-sources-debugger-trace-1.svg
View file

File diff suppressed because one or more lines are too long
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 166 KiB

After

Width:  |  Height:  |  Size: 166 KiB

Before After
Before After

2
1-js/03-code-quality/02-coding-style/code-style.svg
View file

File diff suppressed because one or more lines are too long
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 133 KiB

After

Width:  |  Height:  |  Size: 134 KiB

Before After
Before After

2
1-js/04-object-basics/02-garbage-collection/family-delete-refs.svg
View file

@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="337" height="204" viewBox="0 0 337 204"><defs><style>@import url(https://fonts.googleapis.com/css?family=Open+Sans:bold,italic,bolditalic%7CPT+Mono);@font-face{font-family:&apos;PT Mono&apos;;font-weight:700;font-style:normal;src:local(&apos;PT MonoBold&apos;),url(/font/PTMonoBold.woff2) format(&apos;woff2&apos;),url(/font/PTMonoBold.woff) format(&apos;woff&apos;),url(/font/PTMonoBold.ttf) format(&apos;truetype&apos;)}</style></defs><g id="garbage-collection" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><g id="family-delete-refs.svg"><path id="Line" fill="#9B9B9B" fill-rule="nonzero" d="M147.5 183.5v6h46v2h-46v6l-14-7 14-7z" opacity=".6"/><path id="Rectangle-1" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M88 13h151v26H88z"/><text id="&lt;global-variable&gt;" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="92" y="30">&lt;global variable&gt;</tspan></text><path id="Rectangle-2" fill="#FFF9EB" stroke="#BCA68E" stroke-width="2" d="M123 80h78v26h-78z"/><text id="Object" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="139" y="96">Object</tspan></text><path id="Rectangle-3" fill="#FFF9EB" stroke="#BCA68E" stroke-width="2" d="M5 148h118v48H5z"/><text id="Object-2" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="39" y="165">Object</tspan></text><text id="wife" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="147" y="148">wife</tspan></text><text id="family" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="106" y="63">family</tspan></text><text id="name:-&quot;John&quot;" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="12" font-weight="normal"><tspan x="19" y="185">name: &quot;John&quot;</tspan></text><path id="Rectangle-4" fill="#FFF9EB" stroke="#BCA68E" stroke-width="2" d="M214 148h118v48H214z"/><text id="name:-&quot;Ann&quot;" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="12" font-weight="normal"><tspan x="230" y="185">name: &quot;Ann&quot;</tspan></text><text id="mother" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="242" y="127">mother</tspan></text><text id="Object-3" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="244" y="165">Object</tspan></text><path id="Line" fill="#EE6B47" fill-rule="nonzero" d="M164.5 43.5v18h6l-7 14-7-14h6v-18h2z"/><path id="Line-2" fill="#9B9B9B" fill-rule="nonzero" d="M114.75 111.108l1.142 1.642-35.328 24.575 3.426 4.926L68.5 144.5l7.495-13.741 3.426 4.925 35.329-24.576z" opacity=".6"/><path id="Line" fill="#EE6B47" fill-rule="nonzero" d="M180.5 149.5l14 7-14 7v-6h-48v-2h48v-6zM208.236 111.11l36.254 24.684 3.377-4.96L255.5 144.5l-15.512-2.093 3.376-4.959-36.253-24.684 1.125-1.653z"/><path id="Line-Copy" stroke="#EE6B47" stroke-linecap="square" stroke-width="2" d="M100.5 118.5l-11 14"/><path id="Line-Copy-2" stroke="#EE6B47" stroke-linecap="square" stroke-width="2" d="M89.5 118.5l11 14"/><path id="Line-Copy-4" stroke="#EE6B47" stroke-linecap="square" stroke-width="2" d="M172.5 183.5l-11 14"/><path id="Line-Copy-3" stroke="#EE6B47" stroke-linecap="square" stroke-width="2" d="M161.5 183.5l11 14"/><text id="father" fill="#9B9B9B" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="35" y="127">father</tspan></text><text id="husband" fill="#9B9B9B" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="136" y="181">husband</tspan></text></g></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" width="337" height="204" viewBox="0 0 337 204"><defs><style>@import url(https://fonts.googleapis.com/css?family=Open+Sans:bold,italic,bolditalic%7CPT+Mono);@font-face{font-family:&apos;PT Mono&apos;;font-weight:700;font-style:normal;src:local(&apos;PT MonoBold&apos;),url(/font/PTMonoBold.woff2) format(&apos;woff2&apos;),url(/font/PTMonoBold.woff) format(&apos;woff&apos;),url(/font/PTMonoBold.ttf) format(&apos;truetype&apos;)}</style></defs><g id="garbage-collection" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><g id="family-delete-refs.svg"><path id="Line" fill="#9B9B9B" fill-rule="nonzero" d="M147.5 183.5v6h46v2h-46v6l-14-7 14-7z" opacity=".6"/><path id="Rectangle-1" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M88 13h151v26H88z"/><text id="&lt;global-variable&gt;" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="92" y="30">&lt;global variable&gt;</tspan></text><path id="Rectangle-2" fill="#FFF9EB" stroke="#BCA68E" stroke-width="2" d="M123 80h78v26h-78z"/><text id="Object" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="139" y="96">Object</tspan></text><path id="Rectangle-3" fill="#FFF9EB" stroke="#BCA68E" stroke-width="2" d="M5 148h118v48H5z"/><text id="Object-2" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="39" y="165">Object</tspan></text><text id="wife" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="147" y="148">wife</tspan></text><text id="family" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="106" y="63">family</tspan></text><text id="name:-&quot;John&quot;" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="12" font-weight="normal"><tspan x="19" y="185">name: &quot;John&quot;</tspan></text><path id="Rectangle-4" fill="#FFF9EB" stroke="#BCA68E" stroke-width="2" d="M214 148h118v48H214z"/><text id="name:-&quot;Ann&quot;" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="12" font-weight="normal"><tspan x="230" y="185">name: &quot;Ann&quot;</tspan></text><text id="mother" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="242" y="127">mother</tspan></text><text id="Object-3" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="244" y="165">Object</tspan></text><path id="Line" fill="#EE6B47" fill-rule="nonzero" d="M164.5 43.5v18h6l-7 14-7-14h6v-18h2z"/><path id="Line-2" fill="#9B9B9B" fill-rule="nonzero" d="M114.75 111.108l1.142 1.642-.82.57-34.508 24.005 3.426 4.926L68.5 144.5l7.495-13.741 3.426 4.924 34.508-24.004.82-.571z" opacity=".6"/><path id="Line" fill="#EE6B47" fill-rule="nonzero" d="M180.5 149.5l14 7-14 7v-6h-48v-2h48v-6zM208.236 111.11l.827.563 35.427 24.121 3.377-4.96L255.5 144.5l-15.512-2.093 3.377-4.96-35.428-24.12-.826-.563 1.125-1.653z"/><path id="Line-Copy" stroke="#EE6B47" stroke-linecap="square" stroke-width="2" d="M100.5 118.5l-11 14"/><path id="Line-Copy-2" stroke="#EE6B47" stroke-linecap="square" stroke-width="2" d="M89.5 118.5l11 14"/><path id="Line-Copy-4" stroke="#EE6B47" stroke-linecap="square" stroke-width="2" d="M172.5 183.5l-11 14"/><path id="Line-Copy-3" stroke="#EE6B47" stroke-linecap="square" stroke-width="2" d="M161.5 183.5l11 14"/><text id="father" fill="#9B9B9B" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="35" y="127">father</tspan></text><text id="husband" fill="#9B9B9B" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="136" y="181">husband</tspan></text></g></g></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3.7 KiB

After

Width:  |  Height:  |  Size: 3.7 KiB

Before After
Before After

2
1-js/04-object-basics/02-garbage-collection/family-no-family.svg
View file

@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="420" height="279" viewBox="0 0 420 279"><defs><style>@import url(https://fonts.googleapis.com/css?family=Open+Sans:bold,italic,bolditalic%7CPT+Mono);@font-face{font-family:&apos;PT Mono&apos;;font-weight:700;font-style:normal;src:local(&apos;PT MonoBold&apos;),url(/font/PTMonoBold.woff2) format(&apos;woff2&apos;),url(/font/PTMonoBold.woff) format(&apos;woff&apos;),url(/font/PTMonoBold.ttf) format(&apos;truetype&apos;)}</style></defs><g id="garbage-collection" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><g id="family-no-family.svg"><path id="Line" fill="#EE6B47" fill-rule="nonzero" d="M211.5 228.5v6h46v2h-46v6l-14-7 14-7z"/><path id="Rectangle-1" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M153 25h153v48H153z"/><text id="&lt;global&gt;" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="199" y="43">&lt;global&gt;</tspan></text><path id="Rectangle-2" fill="#FFF9EB" stroke="#BCA68E" stroke-width="2" d="M187 123h78v26h-78z"/><text id="Object" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="203" y="139">Object</tspan></text><path id="Rectangle-3" fill="#FFF9EB" stroke="#BCA68E" stroke-width="2" d="M69 193h118v48H69z"/><text id="Object-2" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="103" y="210">Object</tspan></text><text id="father" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="99" y="170">father</tspan></text><text id="wife" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="211" y="193">wife</tspan></text><text id="name:-&quot;John&quot;" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="12" font-weight="normal"><tspan x="83" y="230">name: &quot;John&quot;</tspan></text><path id="Rectangle-4" fill="#FFF9EB" stroke="#BCA68E" stroke-width="2" d="M278 193h118v48H278z"/><text id="name:-&quot;Ann&quot;" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="12" font-weight="normal"><tspan x="294" y="230">name: &quot;Ann&quot;</tspan></text><text id="mother" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="306" y="170">mother</tspan></text><text id="Object-3" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="308" y="210">Object</tspan></text><path id="Line-2" fill="#EE6B47" fill-rule="nonzero" d="M178.75 154.108l1.142 1.642-35.328 24.575 3.426 4.926-15.49 2.249 7.495-13.741 3.426 4.925 35.329-24.576z"/><path id="Line" fill="#EE6B47" fill-rule="nonzero" d="M244.5 194.5l14 7-14 7v-6h-48v-2h48v-6z"/><text id="husband" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="200" y="226">husband</tspan></text><path id="Line" fill="#EE6B47" fill-rule="nonzero" d="M272.236 154.11l36.254 24.684 3.377-4.96L319.5 187.5l-15.512-2.093 3.376-4.959-36.253-24.684 1.125-1.653z"/><path id="Rectangle-5" stroke="#D0021B" stroke-width="2" d="M48 112h364v150H48z"/><text id="family:-null" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="183" y="66">family: null</tspan></text><g id="noun_48910_cc" transform="translate(8 110)"><path id="Shape" d="M17.503 1.75h-5.006a.341.341 0 00-.34.342v1.125h5.686V2.092a.341.341 0 00-.34-.341z"/><path id="Shape" fill="#D0021B" d="M28.364 3.217H19.59V2.092A2.09 2.09 0 0017.503 0h-5.006c-1.15 0-2.087.938-2.087 2.092v1.125H1.637c-.7 0-1.266.568-1.266 1.269v.09c0 .7.567 1.267 1.266 1.267h26.727c.699 0 1.266-.567 1.266-1.268v-.09c0-.7-.567-1.268-1.266-1.268zm-10.52 0h-5.687V2.092c0-.188.153-.341.34-.341h5.006a.34.34 0 01.34.34v1.126zM26.054 6.281H3.728c-1.298 0-2.35-.224-2.35 1.077L3.14 33.196c0 1.3 1.052 2.409 2.35 2.409h18.802c1.298 0 2.35-1.11 2.35-2.409l1.763-25.838c0-1.301-1.053-1.077-2.35-1.077zM9.637 32.193c-.377.012-.691-.261-.704-.612l-.694-19.917c-.012-.351.283-.647.66-.66.376-.013.69.261.703.613l.694 19.916c.013.351-.283.647-.659.66zm6.044-.63c0 .352-.306.637-.682.637-.377 0-.682-.286-.682-.637V11.634c0-.351.305-.636.682-.636.376 0 .682.285.682.636v19.93zm5.384.018c-.012.351-.327.625-.704.612-.376-.013-.672-.308-.66-.66l.695-19.916c.012-.352.326-.626.703-.613.377.014.672.309.66.66l-.694 19.917z"/></g></g></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" width="420" height="279" viewBox="0 0 420 279"><defs><style>@import url(https://fonts.googleapis.com/css?family=Open+Sans:bold,italic,bolditalic%7CPT+Mono);@font-face{font-family:&apos;PT Mono&apos;;font-weight:700;font-style:normal;src:local(&apos;PT MonoBold&apos;),url(/font/PTMonoBold.woff2) format(&apos;woff2&apos;),url(/font/PTMonoBold.woff) format(&apos;woff&apos;),url(/font/PTMonoBold.ttf) format(&apos;truetype&apos;)}</style></defs><g id="garbage-collection" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><g id="family-no-family.svg"><path id="Line" fill="#EE6B47" fill-rule="nonzero" d="M211.5 228.5v6h46v2h-46v6l-14-7 14-7z"/><path id="Rectangle-1" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M153 25h153v48H153z"/><text id="&lt;global&gt;" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="199" y="43">&lt;global&gt;</tspan></text><path id="Rectangle-2" fill="#FFF9EB" stroke="#BCA68E" stroke-width="2" d="M187 123h78v26h-78z"/><text id="Object" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="203" y="139">Object</tspan></text><path id="Rectangle-3" fill="#FFF9EB" stroke="#BCA68E" stroke-width="2" d="M69 193h118v48H69z"/><text id="Object-2" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="103" y="210">Object</tspan></text><text id="father" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="99" y="170">father</tspan></text><text id="wife" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="211" y="193">wife</tspan></text><text id="name:-&quot;John&quot;" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="12" font-weight="normal"><tspan x="83" y="230">name: &quot;John&quot;</tspan></text><path id="Rectangle-4" fill="#FFF9EB" stroke="#BCA68E" stroke-width="2" d="M278 193h118v48H278z"/><text id="name:-&quot;Ann&quot;" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="12" font-weight="normal"><tspan x="294" y="230">name: &quot;Ann&quot;</tspan></text><text id="mother" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="306" y="170">mother</tspan></text><text id="Object-3" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="308" y="210">Object</tspan></text><path id="Line-2" fill="#EE6B47" fill-rule="nonzero" d="M178.75 154.108l1.142 1.642-.82.57-34.508 24.005 3.426 4.926-15.49 2.249 7.495-13.741 3.426 4.924 34.508-24.004.82-.571z"/><path id="Line" fill="#EE6B47" fill-rule="nonzero" d="M244.5 194.5l14 7-14 7v-6h-48v-2h48v-6z"/><text id="husband" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="200" y="226">husband</tspan></text><path id="Line" fill="#EE6B47" fill-rule="nonzero" d="M272.236 154.11l.827.563 35.427 24.121 3.377-4.96L319.5 187.5l-15.512-2.093 3.377-4.96-35.428-24.12-.826-.563 1.125-1.653z"/><path id="Rectangle-5" stroke="#D0021B" stroke-width="2" d="M48 112h364v150H48z"/><text id="family:-null" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="183" y="66">family: null</tspan></text><g id="noun_48910_cc" transform="translate(8 110)"><path id="Shape" d="M17.503 1.75h-5.006a.341.341 0 00-.34.342v1.125h5.686V2.092a.341.341 0 00-.34-.341z"/><path id="Shape" fill="#D0021B" d="M28.364 3.217H19.59V2.092A2.09 2.09 0 0017.503 0h-5.006c-1.15 0-2.087.938-2.087 2.092v1.125H1.637c-.7 0-1.266.568-1.266 1.269v.09c0 .7.567 1.267 1.266 1.267h26.727c.699 0 1.266-.567 1.266-1.268v-.09c0-.7-.567-1.268-1.266-1.268zm-10.52 0h-5.687V2.092c0-.188.153-.341.34-.341h5.006a.34.34 0 01.34.34v1.126zM26.054 6.281H3.728c-1.298 0-2.35-.224-2.35 1.077L3.14 33.196c0 1.3 1.052 2.409 2.35 2.409h18.802c1.298 0 2.35-1.11 2.35-2.409l1.763-25.838c0-1.301-1.053-1.077-2.35-1.077zM9.637 32.193c-.377.012-.691-.261-.704-.612l-.694-19.917c-.012-.351.283-.647.66-.66.376-.013.69.261.703.613l.694 19.916c.013.351-.283.647-.659.66zm6.044-.63c0 .352-.306.637-.682.637-.377 0-.682-.286-.682-.637V11.634c0-.351.305-.636.682-.636.376 0 .682.285.682.636v19.93zm5.384.018c-.012.351-.327.625-.704.612-.376-.013-.672-.308-.66-.66l.695-19.916c.012-.352.326-.626.703-.613.377.014.672.309.66.66l-.694 19.917z"/></g></g></g></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 4.3 KiB

After

Width:  |  Height:  |  Size: 4.4 KiB

Before After
Before After

2
1-js/04-object-basics/02-garbage-collection/family-no-father.svg
View file

@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="399" height="225" viewBox="0 0 399 225"><defs><style>@import url(https://fonts.googleapis.com/css?family=Open+Sans:bold,italic,bolditalic%7CPT+Mono);@font-face{font-family:&apos;PT Mono&apos;;font-weight:700;font-style:normal;src:local(&apos;PT MonoBold&apos;),url(/font/PTMonoBold.woff2) format(&apos;woff2&apos;),url(/font/PTMonoBold.woff) format(&apos;woff&apos;),url(/font/PTMonoBold.ttf) format(&apos;truetype&apos;)}</style></defs><g id="garbage-collection" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><g id="family-no-father.svg"><path id="Rectangle-2" fill="#FFF9EB" stroke="#BCA68E" stroke-width="2" d="M187 78h78v26h-78z"/><text id="Object" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="203" y="94">Object</tspan></text><path id="Rectangle-3" fill="#FFF9EB" stroke="#BCA68E" stroke-width="2" d="M69 146h118v48H69z"/><text id="Object-2" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="103" y="163">Object</tspan></text><text id="wife" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="211" y="146">wife</tspan></text><text id="family" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="171" y="61">family</tspan></text><text id="name:-&quot;John&quot;" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="12" font-weight="normal"><tspan x="83" y="183">name: &quot;John&quot;</tspan></text><path id="Rectangle-4" fill="#FFF9EB" stroke="#BCA68E" stroke-width="2" d="M278 146h118v48H278z"/><text id="name:-&quot;Ann&quot;" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="12" font-weight="normal"><tspan x="299" y="183">name: &quot;Ann&quot;</tspan></text><text id="mother" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="306" y="125">mother</tspan></text><text id="Object-3" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="308" y="163">Object</tspan></text><path id="Line" fill="#EE6B47" fill-rule="nonzero" d="M228.5 41.5v18h6l-7 14-7-14h6v-18h2zM244.5 147.5l14 7-14 7v-6h-48v-2h48v-6zM272.236 109.11l36.254 24.684 3.377-4.96L319.5 142.5l-15.512-2.093 3.376-4.959-36.253-24.684 1.125-1.653z"/><path id="Rectangle-5" stroke="#D0021B" stroke-width="2" d="M48 117h217v99H48z"/><g id="noun_48910_cc" transform="translate(7 114)"><path id="Shape" d="M17.503 1.75h-5.006a.341.341 0 00-.34.342v1.125h5.686V2.092a.341.341 0 00-.34-.341z"/><path id="Shape" fill="#D0021B" d="M28.364 3.217H19.59V2.092A2.09 2.09 0 0017.503 0h-5.006c-1.15 0-2.087.938-2.087 2.092v1.125H1.637c-.7 0-1.266.568-1.266 1.269v.09c0 .7.567 1.267 1.266 1.267h26.727c.699 0 1.266-.567 1.266-1.268v-.09c0-.7-.567-1.268-1.266-1.268zm-10.52 0h-5.687V2.092c0-.188.153-.341.34-.341h5.006a.34.34 0 01.34.34v1.126zM26.054 6.281H3.728c-1.298 0-2.35-.224-2.35 1.077L3.14 33.196c0 1.3 1.052 2.409 2.35 2.409h18.802c1.298 0 2.35-1.11 2.35-2.409l1.763-25.838c0-1.301-1.053-1.077-2.35-1.077zM9.637 32.193c-.377.012-.691-.261-.704-.612l-.694-19.917c-.012-.351.283-.647.66-.66.376-.013.69.261.703.613l.694 19.916c.013.351-.283.647-.659.66zm6.044-.63c0 .352-.306.637-.682.637-.377 0-.682-.286-.682-.637V11.634c0-.351.305-.636.682-.636.376 0 .682.285.682.636v19.93zm5.384.018c-.012.351-.327.625-.704.612-.376-.013-.672-.308-.66-.66l.695-19.916c.012-.352.326-.626.703-.613.377.014.672.309.66.66l-.694 19.917z"/></g><path id="Rectangle-1" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M181 13h93v26h-93z"/><text id="&lt;global&gt;" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="197" y="30">&lt;global&gt;</tspan></text></g></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" width="399" height="225" viewBox="0 0 399 225"><defs><style>@import url(https://fonts.googleapis.com/css?family=Open+Sans:bold,italic,bolditalic%7CPT+Mono);@font-face{font-family:&apos;PT Mono&apos;;font-weight:700;font-style:normal;src:local(&apos;PT MonoBold&apos;),url(/font/PTMonoBold.woff2) format(&apos;woff2&apos;),url(/font/PTMonoBold.woff) format(&apos;woff&apos;),url(/font/PTMonoBold.ttf) format(&apos;truetype&apos;)}</style></defs><g id="garbage-collection" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><g id="family-no-father.svg"><path id="Rectangle-2" fill="#FFF9EB" stroke="#BCA68E" stroke-width="2" d="M187 78h78v26h-78z"/><text id="Object" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="203" y="94">Object</tspan></text><path id="Rectangle-3" fill="#FFF9EB" stroke="#BCA68E" stroke-width="2" d="M69 146h118v48H69z"/><text id="Object-2" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="103" y="163">Object</tspan></text><text id="wife" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="211" y="146">wife</tspan></text><text id="family" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="171" y="61">family</tspan></text><text id="name:-&quot;John&quot;" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="12" font-weight="normal"><tspan x="83" y="183">name: &quot;John&quot;</tspan></text><path id="Rectangle-4" fill="#FFF9EB" stroke="#BCA68E" stroke-width="2" d="M278 146h118v48H278z"/><text id="name:-&quot;Ann&quot;" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="12" font-weight="normal"><tspan x="299" y="183">name: &quot;Ann&quot;</tspan></text><text id="mother" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="306" y="125">mother</tspan></text><text id="Object-3" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="308" y="163">Object</tspan></text><path id="Line" fill="#EE6B47" fill-rule="nonzero" d="M228.5 41.5v18h6l-7 14-7-14h6v-18h2zM244.5 147.5l14 7-14 7v-6h-48v-2h48v-6zM272.236 109.11l.827.563 35.427 24.121 3.377-4.96L319.5 142.5l-15.512-2.093 3.377-4.96-35.428-24.12-.826-.563 1.125-1.653z"/><path id="Rectangle-5" stroke="#D0021B" stroke-width="2" d="M48 117h217v99H48z"/><g id="noun_48910_cc" transform="translate(7 114)"><path id="Shape" d="M17.503 1.75h-5.006a.341.341 0 00-.34.342v1.125h5.686V2.092a.341.341 0 00-.34-.341z"/><path id="Shape" fill="#D0021B" d="M28.364 3.217H19.59V2.092A2.09 2.09 0 0017.503 0h-5.006c-1.15 0-2.087.938-2.087 2.092v1.125H1.637c-.7 0-1.266.568-1.266 1.269v.09c0 .7.567 1.267 1.266 1.267h26.727c.699 0 1.266-.567 1.266-1.268v-.09c0-.7-.567-1.268-1.266-1.268zm-10.52 0h-5.687V2.092c0-.188.153-.341.34-.341h5.006a.34.34 0 01.34.34v1.126zM26.054 6.281H3.728c-1.298 0-2.35-.224-2.35 1.077L3.14 33.196c0 1.3 1.052 2.409 2.35 2.409h18.802c1.298 0 2.35-1.11 2.35-2.409l1.763-25.838c0-1.301-1.053-1.077-2.35-1.077zM9.637 32.193c-.377.012-.691-.261-.704-.612l-.694-19.917c-.012-.351.283-.647.66-.66.376-.013.69.261.703.613l.694 19.916c.013.351-.283.647-.659.66zm6.044-.63c0 .352-.306.637-.682.637-.377 0-.682-.286-.682-.637V11.634c0-.351.305-.636.682-.636.376 0 .682.285.682.636v19.93zm5.384.018c-.012.351-.327.625-.704.612-.376-.013-.672-.308-.66-.66l.695-19.916c.012-.352.326-.626.703-.613.377.014.672.309.66.66l-.694 19.917z"/></g><path id="Rectangle-1" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M181 13h93v26h-93z"/><text id="&lt;global&gt;" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="197" y="30">&lt;global&gt;</tspan></text></g></g></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3.8 KiB

After

Width:  |  Height:  |  Size: 3.8 KiB

Before After
Before After

2
1-js/04-object-basics/02-garbage-collection/family.svg
View file

@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="337" height="204" viewBox="0 0 337 204"><defs><style>@import url(https://fonts.googleapis.com/css?family=Open+Sans:bold,italic,bolditalic%7CPT+Mono);@font-face{font-family:&apos;PT Mono&apos;;font-weight:700;font-style:normal;src:local(&apos;PT MonoBold&apos;),url(/font/PTMonoBold.woff2) format(&apos;woff2&apos;),url(/font/PTMonoBold.woff) format(&apos;woff&apos;),url(/font/PTMonoBold.ttf) format(&apos;truetype&apos;)}</style></defs><g id="garbage-collection" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><g id="family.svg"><path id="Line" fill="#EE6B47" fill-rule="nonzero" d="M147.5 183.5v6h46v2h-46v6l-14-7 14-7z"/><path id="Rectangle-2" fill="#FFF9EB" stroke="#BCA68E" stroke-width="2" d="M123 80h78v26h-78z"/><text id="Object" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="139" y="96">Object</tspan></text><path id="Rectangle-3" fill="#FFF9EB" stroke="#BCA68E" stroke-width="2" d="M5 148h118v48H5z"/><text id="Object-2" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="39" y="165">Object</tspan></text><text id="father" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="35" y="127">father</tspan></text><text id="wife" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="147" y="148">wife</tspan></text><text id="family" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="107" y="63">family</tspan></text><text id="name:-&quot;John&quot;" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="12" font-weight="normal"><tspan x="19" y="185">name: &quot;John&quot;</tspan></text><path id="Rectangle-4" fill="#FFF9EB" stroke="#BCA68E" stroke-width="2" d="M214 148h118v48H214z"/><text id="name:-&quot;Ann&quot;" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="12" font-weight="normal"><tspan x="230" y="185">name: &quot;Ann&quot;</tspan></text><text id="mother" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="242" y="127">mother</tspan></text><text id="Object-3" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="244" y="165">Object</tspan></text><path id="Line" fill="#EE6B47" fill-rule="nonzero" d="M164.5 43.5v18h6l-7 14-7-14h6v-18h2z"/><path id="Line-2" fill="#EE6B47" fill-rule="nonzero" d="M114.75 111.108l1.142 1.642-35.328 24.575 3.426 4.926L68.5 144.5l7.495-13.741 3.426 4.925 35.329-24.576z"/><path id="Line" fill="#EE6B47" fill-rule="nonzero" d="M180.5 149.5l14 7-14 7v-6h-48v-2h48v-6z"/><text id="husband" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="136" y="181">husband</tspan></text><path id="Line" fill="#EE6B47" fill-rule="nonzero" d="M208.236 111.11l36.254 24.684 3.377-4.96L255.5 144.5l-15.512-2.093 3.376-4.959-36.253-24.684 1.125-1.653z"/><path id="Rectangle-1" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M88 13h151v26H88z"/><text id="&lt;global-variable&gt;" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="92" y="30">&lt;global variable&gt;</tspan></text></g></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" width="337" height="204" viewBox="0 0 337 204"><defs><style>@import url(https://fonts.googleapis.com/css?family=Open+Sans:bold,italic,bolditalic%7CPT+Mono);@font-face{font-family:&apos;PT Mono&apos;;font-weight:700;font-style:normal;src:local(&apos;PT MonoBold&apos;),url(/font/PTMonoBold.woff2) format(&apos;woff2&apos;),url(/font/PTMonoBold.woff) format(&apos;woff&apos;),url(/font/PTMonoBold.ttf) format(&apos;truetype&apos;)}</style></defs><g id="garbage-collection" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><g id="family.svg"><path id="Line" fill="#EE6B47" fill-rule="nonzero" d="M147.5 183.5v6h46v2h-46v6l-14-7 14-7z"/><path id="Rectangle-2" fill="#FFF9EB" stroke="#BCA68E" stroke-width="2" d="M123 80h78v26h-78z"/><text id="Object" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="139" y="96">Object</tspan></text><path id="Rectangle-3" fill="#FFF9EB" stroke="#BCA68E" stroke-width="2" d="M5 148h118v48H5z"/><text id="Object-2" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="39" y="165">Object</tspan></text><text id="father" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="35" y="127">father</tspan></text><text id="wife" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="147" y="148">wife</tspan></text><text id="family" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="107" y="63">family</tspan></text><text id="name:-&quot;John&quot;" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="12" font-weight="normal"><tspan x="19" y="185">name: &quot;John&quot;</tspan></text><path id="Rectangle-4" fill="#FFF9EB" stroke="#BCA68E" stroke-width="2" d="M214 148h118v48H214z"/><text id="name:-&quot;Ann&quot;" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="12" font-weight="normal"><tspan x="230" y="185">name: &quot;Ann&quot;</tspan></text><text id="mother" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="242" y="127">mother</tspan></text><text id="Object-3" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="244" y="165">Object</tspan></text><path id="Line" fill="#EE6B47" fill-rule="nonzero" d="M164.5 43.5v18h6l-7 14-7-14h6v-18h2z"/><path id="Line-2" fill="#EE6B47" fill-rule="nonzero" d="M114.75 111.108l1.142 1.642-.82.57-34.508 24.005 3.426 4.926L68.5 144.5l7.495-13.741 3.426 4.924 34.508-24.004.82-.571z"/><path id="Line" fill="#EE6B47" fill-rule="nonzero" d="M180.5 149.5l14 7-14 7v-6h-48v-2h48v-6z"/><text id="husband" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="136" y="181">husband</tspan></text><path id="Line" fill="#EE6B47" fill-rule="nonzero" d="M208.236 111.11l.827.563 35.427 24.121 3.377-4.96L255.5 144.5l-15.512-2.093 3.377-4.96-35.428-24.12-.826-.563 1.125-1.653z"/><path id="Rectangle-1" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M88 13h151v26H88z"/><text id="&lt;global-variable&gt;" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="92" y="30">&lt;global variable&gt;</tspan></text></g></g></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3.3 KiB

After

Width:  |  Height:  |  Size: 3.3 KiB

Before After
Before After

2
1-js/04-object-basics/02-garbage-collection/garbage-collection-1.svg
View file

File diff suppressed because one or more lines are too long
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 7.4 KiB

After

Width:  |  Height:  |  Size: 7.4 KiB

Before After
Before After

2
1-js/04-object-basics/02-garbage-collection/garbage-collection-2.svg
View file

File diff suppressed because one or more lines are too long
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 8.9 KiB

After

Width:  |  Height:  |  Size: 9 KiB

Before After
Before After

2
1-js/04-object-basics/02-garbage-collection/garbage-collection-3.svg
View file

File diff suppressed because one or more lines are too long
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 10 KiB

After

Width:  |  Height:  |  Size: 10 KiB

Before After
Before After

2
1-js/04-object-basics/02-garbage-collection/garbage-collection-4.svg
View file

File diff suppressed because one or more lines are too long
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 10 KiB

After

Width:  |  Height:  |  Size: 10 KiB

Before After
Before After

2
1-js/04-object-basics/02-garbage-collection/garbage-collection-5.svg
View file

File diff suppressed because one or more lines are too long
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 12 KiB

After

Width:  |  Height:  |  Size: 12 KiB

Before After
Before After

2
1-js/06-advanced-functions/01-recursion/03-fibonacci-numbers/fibonacci-recursion-tree.svg
View file

File diff suppressed because one or more lines are too long
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 5.2 KiB

After

Width:  |  Height:  |  Size: 5.5 KiB

Before After
Before After

2
1-js/06-advanced-functions/01-recursion/linked-list-remove-1.svg
View file

@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="670" height="143" viewBox="0 0 670 143"><defs><style>@import url(https://fonts.googleapis.com/css?family=Open+Sans:bold,italic,bolditalic%7CPT+Mono);@font-face{font-family:&apos;PT Mono&apos;;font-weight:700;font-style:normal;src:local(&apos;PT MonoBold&apos;),url(/font/PTMonoBold.woff2) format(&apos;woff2&apos;),url(/font/PTMonoBold.woff) format(&apos;woff&apos;),url(/font/PTMonoBold.ttf) format(&apos;truetype&apos;)}</style></defs><g id="combined" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><g id="linked-list-remove-1.svg"><path id="Rectangle-15" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M47 30h90v32H47z"/><text id="value" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="43" y="20">value</tspan></text><text id="&quot;new-item&quot;" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="51" y="49">&quot;new item&quot;</tspan></text><path id="Line-21" fill="#EE6B47" fill-rule="nonzero" d="M190.27 38l14 7-14 7-.001-6H131.73v-2h58.539l.001-6z"/><text id="next" fill="#EE6B47" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="156" y="34">next</tspan></text><path id="Rectangle-15-Copy" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M117 104h78v32h-78z" opacity=".6"/><text id="value-copy" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" opacity=".6"><tspan x="118" y="94">value</tspan></text><text id="1" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" opacity=".6"><tspan x="149" y="124">1</tspan></text><path id="Line-21-Copy" fill="#EE6B47" fill-rule="nonzero" d="M229.5 75.5l-5.638 14.602-4.041-4.437-38.157 34.748-1.347-1.48 38.158-34.747-4.04-4.436L229.5 75.5z" opacity=".6"/><text id="next-copy" fill="#EE6B47" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" opacity=".6"><tspan x="214" y="108">next</tspan></text><path id="Rectangle-11" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M208 30h78v32h-78z"/><text id="value-2" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="210" y="20">value</tspan></text><text id="-9" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="242" y="50">2</tspan></text><path id="Line-22" fill="#EE6B47" fill-rule="nonzero" d="M330.27 38l14 7-14 7v-6h-58.54v-2h58.54v-6z"/><text id="next-2" fill="#EE6B47" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="296" y="34">next</tspan></text><path id="Rectangle-13" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M347 30h78v32h-78z"/><text id="value-3" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="349" y="20">value</tspan></text><text id="-10" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="381" y="50">3</tspan></text><path id="Line-23" fill="#EE6B47" fill-rule="nonzero" d="M469.27 38l14 7-14 7v-6h-58.54v-2h58.54v-6z"/><text id="next-3" fill="#EE6B47" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="435" y="34">next</tspan></text><path id="Rectangle-14" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M487 30h78v32h-78z"/><text id="value-4" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="489" y="20">value</tspan></text><text id="4" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="521" y="50">4</tspan></text><path id="Line-24" fill="#EE6B47" fill-rule="nonzero" d="M609.27 38l14 7-14 7v-6h-58.54v-2h58.54v-6z"/><text id="next-4" fill="#EE6B47" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="575" y="34">next</tspan></text><text id="null" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="631" y="49">null</tspan></text><text id="list" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="8" y="49">list</tspan></text></g></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" width="670" height="143" viewBox="0 0 670 143"><defs><style>@import url(https://fonts.googleapis.com/css?family=Open+Sans:bold,italic,bolditalic%7CPT+Mono);@font-face{font-family:&apos;PT Mono&apos;;font-weight:700;font-style:normal;src:local(&apos;PT MonoBold&apos;),url(/font/PTMonoBold.woff2) format(&apos;woff2&apos;),url(/font/PTMonoBold.woff) format(&apos;woff&apos;),url(/font/PTMonoBold.ttf) format(&apos;truetype&apos;)}</style></defs><g id="combined" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><g id="linked-list-remove-1.svg"><path id="Rectangle-15" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M47 30h90v32H47z"/><text id="value" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="43" y="20">value</tspan></text><text id="&quot;new-item&quot;" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="51" y="49">&quot;new item&quot;</tspan></text><path id="Line-21" fill="#EE6B47" fill-rule="nonzero" d="M190.27 38l14 7-14 7-.001-6H131.73v-2h58.539l.001-6z"/><text id="next" fill="#EE6B47" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="156" y="34">next</tspan></text><path id="Rectangle-15-Copy" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M117 104h78v32h-78z" opacity=".6"/><text id="value-copy" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" opacity=".6"><tspan x="118" y="94">value</tspan></text><text id="1" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" opacity=".6"><tspan x="149" y="124">1</tspan></text><path id="Line-21-Copy" fill="#EE6B47" fill-rule="nonzero" d="M229.5 75.5l-5.638 14.602-4.04-4.437-37.419 34.074-.74.674-1.346-1.48.74-.672 37.418-34.074-4.04-4.437L229.5 75.5z" opacity=".6"/><text id="next-copy" fill="#EE6B47" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" opacity=".6"><tspan x="214" y="108">next</tspan></text><path id="Rectangle-11" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M208 30h78v32h-78z"/><text id="value-2" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="210" y="20">value</tspan></text><text id="-9" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="242" y="50">2</tspan></text><path id="Line-22" fill="#EE6B47" fill-rule="nonzero" d="M330.27 38l14 7-14 7v-6h-58.54v-2h58.54v-6z"/><text id="next-2" fill="#EE6B47" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="296" y="34">next</tspan></text><path id="Rectangle-13" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M347 30h78v32h-78z"/><text id="value-3" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="349" y="20">value</tspan></text><text id="-10" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="381" y="50">3</tspan></text><path id="Line-23" fill="#EE6B47" fill-rule="nonzero" d="M469.27 38l14 7-14 7v-6h-58.54v-2h58.54v-6z"/><text id="next-3" fill="#EE6B47" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="435" y="34">next</tspan></text><path id="Rectangle-14" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M487 30h78v32h-78z"/><text id="value-4" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="489" y="20">value</tspan></text><text id="4" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="521" y="50">4</tspan></text><path id="Line-24" fill="#EE6B47" fill-rule="nonzero" d="M609.27 38l14 7-14 7v-6h-58.54v-2h58.54v-6z"/><text id="next-4" fill="#EE6B47" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="575" y="34">next</tspan></text><text id="null" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="631" y="49">null</tspan></text><text id="list" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="8" y="49">list</tspan></text></g></g></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 4.2 KiB

After

Width:  |  Height:  |  Size: 4.2 KiB

Before After
Before After

2
1-js/06-advanced-functions/01-recursion/recursion-pow.svg
View file

@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="502" height="225" viewBox="0 0 502 225"><defs><style>@import url(https://fonts.googleapis.com/css?family=Open+Sans:bold,italic,bolditalic%7CPT+Mono);@font-face{font-family:&apos;PT Mono&apos;;font-weight:700;font-style:normal;src:local(&apos;PT MonoBold&apos;),url(/font/PTMonoBold.woff2) format(&apos;woff2&apos;),url(/font/PTMonoBold.woff) format(&apos;woff&apos;),url(/font/PTMonoBold.ttf) format(&apos;truetype&apos;)}</style></defs><g id="combined" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><g id="recursion-pow.svg"><g id="Rectangle-1-+-Корень" transform="translate(159 2)"><rect id="Rectangle-1" width="78" height="28" x="1" y="1" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" rx="14"/><text id="pow(x,n)" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="8" y="19">pow(x,n)</tspan></text></g><g id="Rectangle-1-+-Корень-Copy-2" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" transform="translate(5 192)"><rect id="Rectangle-1" width="85" height="28" x="1" y="1" rx="14"/></g><text id="x" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="46.5" y="210">x</tspan></text><g id="Rectangle-1-+-Корень-Copy-3" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" transform="translate(353 120)"><rect id="Rectangle-1" width="140" height="28" x="1" y="1" rx="14"/></g><text id="x-*-pow(x,-n-1)" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="362.5" y="138">x * pow(x, n-1)</tspan></text><path id="Line" fill="#EE6B47" fill-rule="nonzero" d="M201 32v41h8l-9.5 19-9.5-19h8V32h3z"/><path id="Path-1218" fill="#EE6B47" fill-rule="nonzero" d="M110.691 129.367v3H51.39v35.18h8l-9.5 19-9.5-19h8v-38.18h62.302z"/><path id="Rectangle-356" fill="#FFF" d="M18 143h60v20H18z"/><g id="Rectangle-354-+-Каково-“официальное”" transform="translate(117 100)"><path id="Rectangle-354" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M2.53 35.5L82.5 69.911 162.47 35.5 82.5 1.089 2.53 35.5z"/><text id="n-==-1-?" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="54.9" y="40">n == 1 ?</tspan></text></g><text id="Yes" fill="#8A704D" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal"><tspan x="40" y="156">Yes</tspan></text><text id="No" fill="#8A704D" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal"><tspan x="299" y="123">No</tspan></text><path id="Line" fill="#EE6B47" fill-rule="nonzero" d="M324 124l19 9.5-19 9.5v-8h-38v-3h38v-8z"/><path id="Line-decoration-1" fill="#EE6B47" stroke="#EE6B47" stroke-width="3" d="M219 59l10.8-3v6z"/><path id="Line" stroke="#EE6B47" stroke-dasharray="5,5" stroke-linecap="square" stroke-width="3" d="M420.5 111.5v-53"/><text id="recursive-call-until" fill="#8A704D" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal"><tspan x="233.5" y="49">recursive call until n==1</tspan></text><path id="Line-Copy" stroke="#EE6B47" stroke-dasharray="5,5" stroke-linecap="square" stroke-width="3" d="M232.5 58.5h189"/></g></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" width="502" height="225" viewBox="0 0 502 225"><defs><style>@import url(https://fonts.googleapis.com/css?family=Open+Sans:bold,italic,bolditalic%7CPT+Mono);@font-face{font-family:&apos;PT Mono&apos;;font-weight:700;font-style:normal;src:local(&apos;PT MonoBold&apos;),url(/font/PTMonoBold.woff2) format(&apos;woff2&apos;),url(/font/PTMonoBold.woff) format(&apos;woff&apos;),url(/font/PTMonoBold.ttf) format(&apos;truetype&apos;)}</style></defs><g id="combined" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><g id="recursion-pow.svg"><g id="Rectangle-1-+-Корень" transform="translate(159 2)"><rect id="Rectangle-1" width="78" height="28" x="1" y="1" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" rx="14"/><text id="pow(x,n)" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="8" y="19">pow(x,n)</tspan></text></g><g id="Rectangle-1-+-Корень-Copy-2" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" transform="translate(5 192)"><rect id="Rectangle-1" width="85" height="28" x="1" y="1" rx="14"/></g><text id="x" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="46.5" y="210">x</tspan></text><g id="Rectangle-1-+-Корень-Copy-3" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" transform="translate(353 120)"><rect id="Rectangle-1" width="140" height="28" x="1" y="1" rx="14"/></g><text id="x-*-pow(x,-n-1)" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="362.5" y="138">x * pow(x, n-1)</tspan></text><path id="Line" fill="#EE6B47" fill-rule="nonzero" d="M201 32v41h8l-9.5 19-9.5-19h8V32h3z"/><path id="Path-1218" fill="#EE6B47" fill-rule="nonzero" d="M110.691 129.367v3l-59.302-.001v35.181h8l-9.5 19-9.5-19h8v-38.18h62.302z"/><path id="Rectangle-356" fill="#FFF" d="M18 143h60v20H18z"/><g id="Rectangle-354-+-Каково-“официальное”" transform="translate(117 100)"><path id="Rectangle-354" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M2.53 35.5L82.5 69.911 162.47 35.5 82.5 1.089 2.53 35.5z"/><text id="n-==-1-?" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="54.9" y="40">n == 1 ?</tspan></text></g><text id="Yes" fill="#8A704D" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal"><tspan x="40" y="156">Yes</tspan></text><text id="No" fill="#8A704D" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal"><tspan x="299" y="123">No</tspan></text><path id="Line" fill="#EE6B47" fill-rule="nonzero" d="M324 124l19 9.5-19 9.5v-8h-38v-3h38v-8z"/><path id="Line-decoration-1" fill="#EE6B47" stroke="#EE6B47" stroke-width="3" d="M219 59l10.8-3v6z"/><path id="Line" stroke="#EE6B47" stroke-dasharray="5,5" stroke-linecap="square" stroke-width="3" d="M420.5 111.5v-53"/><text id="recursive-call-until" fill="#8A704D" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal"><tspan x="233.5" y="49">recursive call until n==1</tspan></text><path id="Line-Copy" stroke="#EE6B47" stroke-dasharray="5,5" stroke-linecap="square" stroke-width="3" d="M232.5 58.5h189"/></g></g></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3.2 KiB

After

Width:  |  Height:  |  Size: 3.2 KiB

Before After
Before After

2
1-js/06-advanced-functions/01-recursion/recursive-salaries.svg
View file

File diff suppressed because one or more lines are too long
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 96 KiB

After

Width:  |  Height:  |  Size: 96 KiB

Before After
Before After

2
1-js/06-advanced-functions/03-closure/lexenv-if.svg
View file

File diff suppressed because one or more lines are too long
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 56 KiB

After

Width:  |  Height:  |  Size: 56 KiB

Before After
Before After

2
1-js/06-advanced-functions/03-closure/lexenv-nested-makecounter-2.svg
View file

File diff suppressed because one or more lines are too long
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 49 KiB

After

Width:  |  Height:  |  Size: 49 KiB

Before After
Before After

2
1-js/06-advanced-functions/03-closure/lexenv-nested-makecounter-3.svg
View file

File diff suppressed because one or more lines are too long
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 49 KiB

After

Width:  |  Height:  |  Size: 49 KiB

Before After
Before After

2
1-js/06-advanced-functions/03-closure/lexenv-nested-makecounter-4.svg
View file

File diff suppressed because one or more lines are too long
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 58 KiB

After

Width:  |  Height:  |  Size: 58 KiB

Before After
Before After

2
1-js/06-advanced-functions/03-closure/lexenv-nested-makecounter-5.svg
View file

File diff suppressed because one or more lines are too long
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 59 KiB

After

Width:  |  Height:  |  Size: 59 KiB

Before After
Before After

2
1-js/06-advanced-functions/03-closure/lexenv-nested-makecounter-6.svg
View file

File diff suppressed because one or more lines are too long
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 68 KiB

After

Width:  |  Height:  |  Size: 68 KiB

Before After
Before After

2
1-js/06-advanced-functions/03-closure/lexical-environment-simple-lookup.svg
View file

File diff suppressed because one or more lines are too long
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 49 KiB

After

Width:  |  Height:  |  Size: 49 KiB

Before After
Before After

2
1-js/06-advanced-functions/03-closure/lexical-environment-simple.svg
View file

File diff suppressed because one or more lines are too long
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 49 KiB

After

Width:  |  Height:  |  Size: 49 KiB

Before After
Before After

2
1-js/06-advanced-functions/03-closure/lexical-search-order.svg
View file

File diff suppressed because one or more lines are too long
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 35 KiB

After

Width:  |  Height:  |  Size: 35 KiB

Before After
Before After

2
1-js/08-prototypes/03-native-prototypes/native-prototypes-classes.svg
View file

File diff suppressed because one or more lines are too long
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 5.4 KiB

After

Width:  |  Height:  |  Size: 5.4 KiB

Before After
Before After

2
1-js/09-classes/02-class-inheritance/animal-rabbit-extends.svg
View file

@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="560" height="316" viewBox="0 0 560 316"><defs><style>@import url(https://fonts.googleapis.com/css?family=Open+Sans:bold,italic,bolditalic%7CPT+Mono);@font-face{font-family:&apos;PT Mono&apos;;font-weight:700;font-style:normal;src:local(&apos;PT MonoBold&apos;),url(/font/PTMonoBold.woff2) format(&apos;woff2&apos;),url(/font/PTMonoBold.woff) format(&apos;woff&apos;),url(/font/PTMonoBold.ttf) format(&apos;truetype&apos;)}</style></defs><g id="inheritance" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><g id="animal-rabbit-extends.svg"><path id="Rectangle-1" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M242 23h185v64H242z"/><text id="constructor:-Animal" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="252" y="42">constructor: Animal</tspan> <tspan x="252" y="57">run: function</tspan> <tspan x="252" y="72">stop: function</tspan></text><path id="Rectangle-1-Copy" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M242 286h185v28H242z"/><text id="Animal.prototype" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="241" y="15">Animal.prototype</tspan></text><path id="Rectangle-1-Copy-4" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M242 166h185v48H242z"/><text id="constructor:-Rabbit" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="252" y="185">constructor: Rabbit</tspan> <tspan x="252" y="200">hide: function</tspan></text><text id="Rabbit.prototype" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="241" y="158">Rabbit.prototype</tspan></text><path id="Rectangle-1-Copy-2" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M11 23h105v48H11z"/><text id="Animal" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="10" y="15">Animal</tspan></text><path id="Rectangle-1-Copy-3" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M11 166h105v48H11z"/><text id="Rabbit" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="10" y="158">Rabbit</tspan></text><text id="new-Rabbit" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="247" y="278">new Rabbit</tspan></text><path id="Line" fill="#EE6B47" fill-rule="nonzero" d="M330.5 96.5l7 14h-6v28h-2v-28h-6l7-14z"/><path id="Line-Copy" fill="#EE6B47" fill-rule="nonzero" d="M211 40l14 7-14 7v-6h-79v-2h79v-6z"/><path id="Line-Copy-4" fill="#EE6B47" fill-rule="nonzero" d="M489.157 87.31l.533.847-26.232 16.515 7.761-.384.05.999-10.555.523 5.034-9.292.879.476-3.702 6.831 26.232-16.515z"/><text id="[[Prototype]]" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="340" y="120">[[Prototype]]</tspan></text><path id="Line-Copy-3" fill="#EE6B47" fill-rule="nonzero" d="M330.5 230.5l7 14h-6v28h-2v-28h-6l7-14z"/><text id="[[Prototype]]-Copy" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="340" y="254">[[Prototype]]</tspan></text><text id="prototype" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="139" y="35">prototype</tspan></text><path id="Line-Copy-2" fill="#EE6B47" fill-rule="nonzero" d="M211 182l14 7-14 7v-6h-79v-2h79v-6z"/><text id="prototype-copy" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="139" y="176">prototype</tspan></text><text id="name:-&quot;White-Rabbit&quot;" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="253" y="304">name: &quot;White Rabbit&quot;</tspan></text><text id="constructor" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="17" y="41">constructor</tspan></text><text id="constructor-copy" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="17" y="183">constructor</tspan></text><ellipse id="Oval" cx="391.5" cy="117.5" stroke="#EE6B47" rx="70.5" ry="20.5"/><text id="extends" fill="#EE6B47" font-family="PTMono-Regular, PT Mono" font-size="16" font-weight="normal"><tspan x="489" y="83">extends</tspan></text></g></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" width="560" height="316" viewBox="0 0 560 316"><defs><style>@import url(https://fonts.googleapis.com/css?family=Open+Sans:bold,italic,bolditalic%7CPT+Mono);@font-face{font-family:&apos;PT Mono&apos;;font-weight:700;font-style:normal;src:local(&apos;PT MonoBold&apos;),url(/font/PTMonoBold.woff2) format(&apos;woff2&apos;),url(/font/PTMonoBold.woff) format(&apos;woff&apos;),url(/font/PTMonoBold.ttf) format(&apos;truetype&apos;)}</style></defs><g id="inheritance" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><g id="animal-rabbit-extends.svg"><path id="Rectangle-1" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M242 23h185v64H242z"/><text id="constructor:-Animal" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="252" y="42">constructor: Animal</tspan> <tspan x="252" y="57">run: function</tspan> <tspan x="252" y="72">stop: function</tspan></text><path id="Rectangle-1-Copy" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M242 286h185v28H242z"/><text id="Animal.prototype" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="241" y="15">Animal.prototype</tspan></text><path id="Rectangle-1-Copy-4" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M242 166h185v48H242z"/><text id="constructor:-Rabbit" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="252" y="185">constructor: Rabbit</tspan> <tspan x="252" y="200">hide: function</tspan></text><text id="Rabbit.prototype" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="241" y="158">Rabbit.prototype</tspan></text><path id="Rectangle-1-Copy-2" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M11 23h105v48H11z"/><text id="Animal" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="10" y="15">Animal</tspan></text><path id="Rectangle-1-Copy-3" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M11 166h105v48H11z"/><text id="Rabbit" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="10" y="158">Rabbit</tspan></text><text id="new-Rabbit" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="247" y="278">new Rabbit</tspan></text><path id="Line" fill="#EE6B47" fill-rule="nonzero" d="M330.5 96.5l7 14h-6v28h-2v-28h-6l7-14z"/><path id="Line-Copy" fill="#EE6B47" fill-rule="nonzero" d="M211 40l14 7-14 7v-6h-79v-2h79v-6z"/><path id="Line-Copy-4" fill="#EE6B47" fill-rule="nonzero" d="M489.157 87.31l.533.847-.424.266-20.68 13.021-5.129 3.228 7.263-.36.499-.024.05.999-.5.024-9.167.455-.888.044.423-.782 4.372-8.07.239-.44.879.476-.238.44-3.464 6.392 5.128-3.228 20.68-13.021.424-.267z"/><text id="[[Prototype]]" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="340" y="120">[[Prototype]]</tspan></text><path id="Line-Copy-3" fill="#EE6B47" fill-rule="nonzero" d="M330.5 230.5l7 14h-6v28h-2v-28h-6l7-14z"/><text id="[[Prototype]]-Copy" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="340" y="254">[[Prototype]]</tspan></text><text id="prototype" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="139" y="35">prototype</tspan></text><path id="Line-Copy-2" fill="#EE6B47" fill-rule="nonzero" d="M211 182l14 7-14 7v-6h-79v-2h79v-6z"/><text id="prototype-copy" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="139" y="176">prototype</tspan></text><text id="name:-&quot;White-Rabbit&quot;" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="253" y="304">name: &quot;White Rabbit&quot;</tspan></text><text id="constructor" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="17" y="41">constructor</tspan></text><text id="constructor-copy" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="17" y="183">constructor</tspan></text><ellipse id="Oval" cx="391.5" cy="117.5" stroke="#EE6B47" rx="70.5" ry="20.5"/><text id="extends" fill="#EE6B47" font-family="PTMono-Regular, PT Mono" font-size="16" font-weight="normal"><tspan x="489" y="83">extends</tspan></text></g></g></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 4.3 KiB

After

Width:  |  Height:  |  Size: 4.4 KiB

Before After
Before After

2
1-js/09-classes/02-class-inheritance/super-homeobject-wrong.svg
View file

@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="395" height="192" viewBox="0 0 395 192"><defs><style>@import url(https://fonts.googleapis.com/css?family=Open+Sans:bold,italic,bolditalic%7CPT+Mono);@font-face{font-family:&apos;PT Mono&apos;;font-weight:700;font-style:normal;src:local(&apos;PT MonoBold&apos;),url(/font/PTMonoBold.woff2) format(&apos;woff2&apos;),url(/font/PTMonoBold.woff) format(&apos;woff&apos;),url(/font/PTMonoBold.ttf) format(&apos;truetype&apos;)}</style></defs><g id="inheritance" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><g id="super-homeobject-wrong.svg"><path id="Rectangle-1" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M237 30v28h98V30h-98z"/><text id="sayHi" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="247" y="48">sayHi</tspan></text><text id="plant" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="241" y="22">plant</tspan></text><path id="Rectangle-1-Copy-4" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M237 143v28h98v-28h-98z"/><text id="sayHi" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="247" y="162">sayHi</tspan></text><text id="tree" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="241" y="135">tree</tspan></text><path id="Line" fill="#EE6B47" fill-rule="nonzero" d="M287.5 70.5l7 14h-6v28h-2v-28h-6l7-14z"/><path id="Line-Copy" fill="#EE6B47" fill-rule="nonzero" d="M121.025 150.55l-.022 6 125 .454-.007 2-125-.454-.021 6L107 157.5l14.025-6.95z"/><path id="Rectangle-1-Copy-3" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M8 30h98v28H8z"/><text id="sayHi" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="18" y="48">sayHi</tspan></text><path id="Rectangle-1-Copy-2" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M8 143h98v28H8z"/><text id="animal" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="12" y="22">animal</tspan></text><text id="rabbit" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="12" y="131">rabbit</tspan></text><path id="Line-Copy-4" fill="#EE6B47" fill-rule="nonzero" d="M58.5 72.5l7 14h-6v28h-2v-28h-6l7-14z"/><text id="[[HomeObject]]" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="115" y="142">[[HomeObject]]</tspan></text><text id="sayHi" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="16" y="162">sayHi</tspan></text></g></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" width="395" height="192" viewBox="0 0 395 192"><defs><style>@import url(https://fonts.googleapis.com/css?family=Open+Sans:bold,italic,bolditalic%7CPT+Mono);@font-face{font-family:&apos;PT Mono&apos;;font-weight:700;font-style:normal;src:local(&apos;PT MonoBold&apos;),url(/font/PTMonoBold.woff2) format(&apos;woff2&apos;),url(/font/PTMonoBold.woff) format(&apos;woff&apos;),url(/font/PTMonoBold.ttf) format(&apos;truetype&apos;)}</style></defs><g id="inheritance" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><g id="super-homeobject-wrong.svg"><path id="Rectangle-1" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M237 30v28h98V30h-98z"/><text id="sayHi" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="247" y="48">sayHi</tspan></text><text id="plant" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="241" y="22">plant</tspan></text><path id="Rectangle-1-Copy-4" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M237 143v28h98v-28h-98z"/><text id="sayHi" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="247" y="162">sayHi</tspan></text><text id="tree" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="241" y="135">tree</tspan></text><path id="Line" fill="#EE6B47" fill-rule="nonzero" d="M287.5 70.5l7 14h-6v28h-2v-28h-6l7-14z"/><path id="Line-Copy" fill="#EE6B47" fill-rule="nonzero" d="M121.025 150.55l-.022 6.001 124 .449 1 .004-.007 2-1-.004-124-.449-.021 6L107 157.5l14.025-6.95z"/><path id="Rectangle-1-Copy-3" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M8 30h98v28H8z"/><text id="sayHi" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="18" y="48">sayHi</tspan></text><path id="Rectangle-1-Copy-2" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M8 143h98v28H8z"/><text id="animal" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="12" y="22">animal</tspan></text><text id="rabbit" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="12" y="131">rabbit</tspan></text><path id="Line-Copy-4" fill="#EE6B47" fill-rule="nonzero" d="M58.5 72.5l7 14h-6v28h-2v-28h-6l7-14z"/><text id="[[HomeObject]]" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="115" y="142">[[HomeObject]]</tspan></text><text id="sayHi" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="16" y="162">sayHi</tspan></text></g></g></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.6 KiB

After

Width:  |  Height:  |  Size: 2.7 KiB

Before After
Before After

2
1-js/09-classes/06-instanceof/instanceof.svg
View file

@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="509" height="435" viewBox="0 0 509 435"><defs><style>@import url(https://fonts.googleapis.com/css?family=Open+Sans:bold,italic,bolditalic%7CPT+Mono);@font-face{font-family:&apos;PT Mono&apos;;font-weight:700;font-style:normal;src:local(&apos;PT MonoBold&apos;),url(/font/PTMonoBold.woff2) format(&apos;woff2&apos;),url(/font/PTMonoBold.woff) format(&apos;woff&apos;),url(/font/PTMonoBold.ttf) format(&apos;truetype&apos;)}</style></defs><g id="inheritance" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><g id="instanceof.svg"><path id="Rectangle-1" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M9 200h139v28H9z"/><text id="Animal.prototype" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="8" y="192">Animal.prototype</tspan></text><path id="Rectangle-1" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M9 94h139v28H9z"/><text id="Object.prototype" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="8" y="86">Object.prototype</tspan></text><path id="Line-2" fill="#EE6B47" fill-rule="nonzero" d="M68.5 134.5l7 14h-6v28h-2v-28h-6l7-14z"/><path id="Rectangle-1-Copy" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M9 307h139v28H9z"/><text id="Rabbit.prototype" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="8" y="299">Rabbit.prototype</tspan></text><path id="Line-2-Copy" fill="#EE6B47" fill-rule="nonzero" d="M68.5 241.5l7 14h-6v28h-2v-28h-6l7-14z"/><text id="[[Prototype]]" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="80" y="266">[[Prototype]]</tspan></text><path id="Rectangle-1-Copy-2" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M9 398h139v28H9z"/><text id="rabbit" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="8" y="390">rabbit</tspan></text><path id="Line-2-Copy-2" fill="#EE6B47" fill-rule="nonzero" d="M68.5 347.5l7 14h-6v28h-2v-28h-6l7-14z"/><text id="[[Prototype]]-Copy-3" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="80" y="372">[[Prototype]]</tspan></text><text id="[[Prototype]]-Copy" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="80" y="159">[[Prototype]]</tspan></text><path id="Line-2" fill="#EE6B47" fill-rule="nonzero" d="M70.5 27.5l7 14h-6v28h-2v-28h-6l7-14z"/><text id="null" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="56" y="16">null</tspan></text><text id="[[Prototype]]-Copy-2" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="81" y="54">[[Prototype]]</tspan></text><text id="=-Animal.prototype?" fill="#EE6B47" font-family="PTMono-Regular, PT Mono" font-size="16" font-weight="normal"><tspan x="317" y="217">= Animal.prototype?</tspan></text><path id="Line" fill="#EE6B47" fill-rule="nonzero" d="M305.787 232.115l1.098 1.672-117.132 76.867 3.292 5.017L177.5 317.5l7.864-13.534 3.292 5.016 117.131-76.867z"/><path id="Line-Copy" fill="#EE6B47" fill-rule="nonzero" d="M198.5 205.5v6h107v2h-107v6l-14-7 14-7z"/><path id="Line-Copy-2" fill="#EE6B47" fill-rule="nonzero" d="M182.5 122.5l15.6 1.276-3.112 5.129 110.886 67.259-1.038 1.71-110.885-67.259-3.111 5.13-8.34-13.245z"/></g></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" width="509" height="435" viewBox="0 0 509 435"><defs><style>@import url(https://fonts.googleapis.com/css?family=Open+Sans:bold,italic,bolditalic%7CPT+Mono);@font-face{font-family:&apos;PT Mono&apos;;font-weight:700;font-style:normal;src:local(&apos;PT MonoBold&apos;),url(/font/PTMonoBold.woff2) format(&apos;woff2&apos;),url(/font/PTMonoBold.woff) format(&apos;woff&apos;),url(/font/PTMonoBold.ttf) format(&apos;truetype&apos;)}</style></defs><g id="inheritance" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><g id="instanceof.svg"><path id="Rectangle-1" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M9 200h139v28H9z"/><text id="Animal.prototype" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="8" y="192">Animal.prototype</tspan></text><path id="Rectangle-1" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M9 94h139v28H9z"/><text id="Object.prototype" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="8" y="86">Object.prototype</tspan></text><path id="Line-2" fill="#EE6B47" fill-rule="nonzero" d="M68.5 134.5l7 14h-6v28h-2v-28h-6l7-14z"/><path id="Rectangle-1-Copy" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M9 307h139v28H9z"/><text id="Rabbit.prototype" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="8" y="299">Rabbit.prototype</tspan></text><path id="Line-2-Copy" fill="#EE6B47" fill-rule="nonzero" d="M68.5 241.5l7 14h-6v28h-2v-28h-6l7-14z"/><text id="[[Prototype]]" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="80" y="266">[[Prototype]]</tspan></text><path id="Rectangle-1-Copy-2" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M9 398h139v28H9z"/><text id="rabbit" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="8" y="390">rabbit</tspan></text><path id="Line-2-Copy-2" fill="#EE6B47" fill-rule="nonzero" d="M68.5 347.5l7 14h-6v28h-2v-28h-6l7-14z"/><text id="[[Prototype]]-Copy-3" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="80" y="372">[[Prototype]]</tspan></text><text id="[[Prototype]]-Copy" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="80" y="159">[[Prototype]]</tspan></text><path id="Line-2" fill="#EE6B47" fill-rule="nonzero" d="M70.5 27.5l7 14h-6v28h-2v-28h-6l7-14z"/><text id="null" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="56" y="16">null</tspan></text><text id="[[Prototype]]-Copy-2" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="81" y="54">[[Prototype]]</tspan></text><text id="=-Animal.prototype?" fill="#EE6B47" font-family="PTMono-Regular, PT Mono" font-size="16" font-weight="normal"><tspan x="317" y="217">= Animal.prototype?</tspan></text><path id="Line" fill="#EE6B47" fill-rule="nonzero" d="M305.787 232.115l1.098 1.672-.836.549-116.296 76.318 3.292 5.017L177.5 317.5l7.864-13.534 3.292 5.016 116.295-76.318.836-.549z"/><path id="Line-Copy" fill="#EE6B47" fill-rule="nonzero" d="M198.5 205.5v6h107v2h-107v6l-14-7 14-7z"/><path id="Line-Copy-2" fill="#EE6B47" fill-rule="nonzero" d="M182.5 122.5l15.6 1.276-3.112 5.129 110.03 66.74.856.519-1.038 1.71-.855-.519-110.03-66.74-3.111 5.13-8.34-13.245z"/></g></g></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3.4 KiB

After

Width:  |  Height:  |  Size: 3.4 KiB

Before After
Before After

2
1-js/10-error-handling/1-try-catch/try-catch-flow.svg
View file

@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="514" height="411" viewBox="0 0 514 411"><defs><style>@import url(https://fonts.googleapis.com/css?family=Open+Sans:bold,italic,bolditalic%7CPT+Mono);@font-face{font-family:&apos;PT Mono&apos;;font-weight:700;font-style:normal;src:local(&apos;PT MonoBold&apos;),url(/font/PTMonoBold.woff2) format(&apos;woff2&apos;),url(/font/PTMonoBold.woff) format(&apos;woff&apos;),url(/font/PTMonoBold.ttf) format(&apos;truetype&apos;)}</style></defs><g id="combined" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><g id="try-catch-flow.svg"><g id="Rectangle-1-+-Корень" transform="translate(207 4)"><rect id="Rectangle-1" width="78" height="28" x="1" y="1" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" rx="14"/><text id="Begin" fill="#8A704D" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal"><tspan x="21" y="20">Begin</tspan></text></g><path id="Line" fill="#EE6B47" fill-rule="nonzero" d="M249 34v23.049l8 .001-9.5 19-9.5-19 8-.001V34h3z"/><path id="Line-Copy" fill="#EE6B47" fill-rule="nonzero" d="M399 297v23.049l8 .001-9.5 19-9.5-19 8-.001V297h3z"/><path id="Path-1218" fill="#EE6B47" fill-rule="nonzero" d="M158.5 131.5v3h-59v85h8l-9.5 19-9.5-19h8v-88h62z"/><path id="Path-1218-Copy" fill="#EE6B47" fill-rule="nonzero" d="M400.5 131.5l-.001 88h8.001l-9.5 19-9.5-19h7.999l.001-85h-82v-3h85z"/><g id="Rectangle-354-+-Каково-“официальное”" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" transform="translate(154 81)"><path id="Rectangle-354" d="M2.06 52l91.55 50.856L185.161 52 93.611 1.144 2.058 52z"/></g><g id="Rectangle-356-+-Отмена" transform="translate(59 177)"><path id="Rectangle-356" fill="#FFF" d="M0 2h60v20H0z"/><text id="No-Errors" fill="#8A704D" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal"><tspan x="7.5" y="15">No Errors</tspan></text></g><g id="Rectangle-356-Copy-+-“Админ”" transform="translate(303 176)"><path id="Rectangle-356-Copy" fill="#FFF" d="M65 2h60v20H65z"/><text id="An-error-occured-in" fill="#8A704D" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal"><tspan x=".932" y="15">An error occured in the code</tspan></text></g><rect id="Rectangle-1-Copy-2" width="214" height="49" x="292" y="349" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" rx="24.5"/><rect id="Rectangle-1" width="195" height="49" x="1" y="244" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" rx="24.5"/><rect id="Rectangle-1-Copy" width="216" height="49" x="290" y="244" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" rx="24.5"/><text id="Ignore-catch-block" fill="#8A704D" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal"><tspan x="39" y="272">Ignore catch block</tspan></text><text id="Ignore-the-rest-of-t" fill="#8A704D" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal"><tspan x="332" y="272">Ignore the rest of try</tspan></text><text id="Execute-catch-block" fill="#8A704D" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal"><tspan x="333" y="379">Execute catch block</tspan></text><text id="try-{-}" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="218" y="117">try {</tspan> <tspan x="218" y="157">}</tspan></text><text id="//-code..." fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="232" y="138">// code...</tspan></text></g></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" width="514" height="411" viewBox="0 0 514 411"><defs><style>@import url(https://fonts.googleapis.com/css?family=Open+Sans:bold,italic,bolditalic%7CPT+Mono);@font-face{font-family:&apos;PT Mono&apos;;font-weight:700;font-style:normal;src:local(&apos;PT MonoBold&apos;),url(/font/PTMonoBold.woff2) format(&apos;woff2&apos;),url(/font/PTMonoBold.woff) format(&apos;woff&apos;),url(/font/PTMonoBold.ttf) format(&apos;truetype&apos;)}</style></defs><g id="combined" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><g id="try-catch-flow.svg"><g id="Rectangle-1-+-Корень" transform="translate(207 4)"><rect id="Rectangle-1" width="78" height="28" x="1" y="1" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" rx="14"/><text id="Begin" fill="#8A704D" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal"><tspan x="21" y="20">Begin</tspan></text></g><path id="Line" fill="#EE6B47" fill-rule="nonzero" d="M249 34v23.049l8 .001-9.5 19-9.5-19 8-.001V34h3z"/><path id="Line-Copy" fill="#EE6B47" fill-rule="nonzero" d="M399 297v23.049l8 .001-9.5 19-9.5-19 8-.001V297h3z"/><path id="Path-1218" fill="#EE6B47" fill-rule="nonzero" d="M158.5 131.5v3h-59v85h8l-9.5 19-9.5-19h8v-88h62z"/><path id="Path-1218-Copy" fill="#EE6B47" fill-rule="nonzero" d="M400.5 131.5l-.001 88h8.001l-9.5 19-9.5-19h7.999v-85H315.5v-3h85z"/><g id="Rectangle-354-+-Каково-“официальное”" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" transform="translate(154 81)"><path id="Rectangle-354" d="M2.06 52l91.55 50.856L185.161 52 93.611 1.144 2.058 52z"/></g><g id="Rectangle-356-+-Отмена" transform="translate(59 177)"><path id="Rectangle-356" fill="#FFF" d="M0 2h60v20H0z"/><text id="No-Errors" fill="#8A704D" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal"><tspan x="7.5" y="15">No Errors</tspan></text></g><g id="Rectangle-356-Copy-+-“Админ”" transform="translate(303 176)"><path id="Rectangle-356-Copy" fill="#FFF" d="M65 2h60v20H65z"/><text id="An-error-occured-in" fill="#8A704D" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal"><tspan x=".932" y="15">An error occured in the code</tspan></text></g><rect id="Rectangle-1-Copy-2" width="214" height="49" x="292" y="349" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" rx="24.5"/><rect id="Rectangle-1" width="195" height="49" x="1" y="244" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" rx="24.5"/><rect id="Rectangle-1-Copy" width="216" height="49" x="290" y="244" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" rx="24.5"/><text id="Ignore-catch-block" fill="#8A704D" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal"><tspan x="39" y="272">Ignore catch block</tspan></text><text id="Ignore-the-rest-of-t" fill="#8A704D" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal"><tspan x="332" y="272">Ignore the rest of try</tspan></text><text id="Execute-catch-block" fill="#8A704D" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal"><tspan x="333" y="379">Execute catch block</tspan></text><text id="try-{-}" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="218" y="117">try {</tspan> <tspan x="218" y="157">}</tspan></text><text id="//-code..." fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="232" y="138">// code...</tspan></text></g></g></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3.4 KiB

After

Width:  |  Height:  |  Size: 3.4 KiB

Before After
Before After

2
1-js/11-async/02-promise-basics/promise-resolve-reject.svg
View file

@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="512" height="246" viewBox="0 0 512 246"><defs><style>@import url(https://fonts.googleapis.com/css?family=Open+Sans:bold,italic,bolditalic%7CPT+Mono);@font-face{font-family:&apos;PT Mono&apos;;font-weight:700;font-style:normal;src:local(&apos;PT MonoBold&apos;),url(/font/PTMonoBold.woff2) format(&apos;woff2&apos;),url(/font/PTMonoBold.woff) format(&apos;woff&apos;),url(/font/PTMonoBold.ttf) format(&apos;truetype&apos;)}</style></defs><g id="promise" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><g id="promise-resolve-reject.svg"><path id="Rectangle-1" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M1 91h182v70H1z"/><text id="new-Promise(executor" fill="#707175" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="2" y="82">new Promise(executor)</tspan></text><text id="state:-&quot;pending&quot;-res" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="13" y="115.432">state: &quot;pending&quot;</tspan> <tspan x="13" y="135.432">result: undefined</tspan></text><path id="Line" fill="#EE6B47" fill-rule="nonzero" d="M196.51 134.673l104.192 47.993 2.51-5.45L313 189.433l-15.644.5 2.509-5.45-104.192-47.992.837-1.817z"/><path id="Line-Copy" fill="#EE6B47" fill-rule="nonzero" d="M297.38 56L313 57l-10.173 11.896-2.335-5.527-104.024 43.941-.778-1.842 104.024-43.942-2.334-5.527z"/><text id="resolve(value)" fill="#EE6B47" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" transform="rotate(-23 244.39 72.63)"><tspan x="185.59" y="77.13">resolve(value)</tspan></text><text id="reject(error)" fill="#EE6B47" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" transform="rotate(25 251.634 150.64)"><tspan x="197.034" y="155.141">reject(error)</tspan></text><path id="Rectangle-1-Copy" fill="#FFF9EB" stroke="#7ED321" stroke-width="2" d="M323 10h182v64H323z"/><text id="state:-&quot;fulfilled&quot;-r" fill="#417505" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="338" y="34.432">state: &quot;fulfilled&quot;</tspan> <tspan x="338" y="54.432">result: value</tspan></text><path id="Rectangle-1-Copy-3" fill="#FCDFE1" stroke="#C74A6C" stroke-width="2" d="M323 177h182v64H323z"/><text id="state:-&quot;rejected&quot;-re" fill="#727155" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="338" y="201.432">state: &quot;rejected&quot;</tspan> <tspan x="338" y="221.432">result: error</tspan></text></g></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" width="512" height="246" viewBox="0 0 512 246"><defs><style>@import url(https://fonts.googleapis.com/css?family=Open+Sans:bold,italic,bolditalic%7CPT+Mono);@font-face{font-family:&apos;PT Mono&apos;;font-weight:700;font-style:normal;src:local(&apos;PT MonoBold&apos;),url(/font/PTMonoBold.woff2) format(&apos;woff2&apos;),url(/font/PTMonoBold.woff) format(&apos;woff&apos;),url(/font/PTMonoBold.ttf) format(&apos;truetype&apos;)}</style></defs><g id="promise" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><g id="promise-resolve-reject.svg"><path id="Rectangle-1" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M1 91h182v70H1z"/><text id="new-Promise(executor" fill="#707175" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="2" y="82">new Promise(executor)</tspan></text><text id="state:-&quot;pending&quot;-res" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="13" y="115.432">state: &quot;pending&quot;</tspan> <tspan x="13" y="135.432">result: undefined</tspan></text><path id="Line" fill="#EE6B47" fill-rule="nonzero" d="M196.51 134.673l.908.419 103.284 47.574 2.51-5.45L313 189.433l-15.644.5 2.509-5.45-103.283-47.574-.909-.418.837-1.817z"/><path id="Line-Copy" fill="#EE6B47" fill-rule="nonzero" d="M297.38 56L313 57l-10.173 11.896-2.335-5.528-103.103 43.553-.921.39-.778-1.843.92-.39 103.104-43.552-2.334-5.527z"/><text id="resolve(value)" fill="#EE6B47" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" transform="rotate(-23 244.39 72.63)"><tspan x="185.59" y="77.13">resolve(value)</tspan></text><text id="reject(error)" fill="#EE6B47" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" transform="rotate(25 251.634 150.64)"><tspan x="197.034" y="155.141">reject(error)</tspan></text><path id="Rectangle-1-Copy" fill="#FFF9EB" stroke="#7ED321" stroke-width="2" d="M323 10h182v64H323z"/><text id="state:-&quot;fulfilled&quot;-r" fill="#417505" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="338" y="34.432">state: &quot;fulfilled&quot;</tspan> <tspan x="338" y="54.432">result: value</tspan></text><path id="Rectangle-1-Copy-3" fill="#FCDFE1" stroke="#C74A6C" stroke-width="2" d="M323 177h182v64H323z"/><text id="state:-&quot;rejected&quot;-re" fill="#727155" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="338" y="201.432">state: &quot;rejected&quot;</tspan> <tspan x="338" y="221.432">result: error</tspan></text></g></g></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.5 KiB

After

Width:  |  Height:  |  Size: 2.5 KiB

Before After
Before After

2
1-js/11-async/03-promise-chaining/promise-handler-variants.svg
View file

File diff suppressed because one or more lines are too long
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 7.1 KiB

After

Width:  |  Height:  |  Size: 7.2 KiB

Before After
Before After

2
1-js/11-async/03-promise-chaining/promise-then-many.svg
View file

@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="373" height="152" viewBox="0 0 373 152"><defs><style>@import url(https://fonts.googleapis.com/css?family=Open+Sans:bold,italic,bolditalic%7CPT+Mono);@font-face{font-family:&apos;PT Mono&apos;;font-weight:700;font-style:normal;src:local(&apos;PT MonoBold&apos;),url(/font/PTMonoBold.woff2) format(&apos;woff2&apos;),url(/font/PTMonoBold.woff) format(&apos;woff&apos;),url(/font/PTMonoBold.ttf) format(&apos;truetype&apos;)}</style></defs><g id="promise" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><g id="promise-then-many.svg"><path id="Rectangle-1-Copy-3" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M10 120h108v28H10z"/><text id=".then" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="42.5" y="139">.then</tspan></text><path id="Rectangle-1-Copy-8" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M131 4h108v28H131z"/><text id="new-Promise" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="138.3" y="22">new Promise</tspan></text><text id="resolve(1)" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="142" y="54">resolve(1)</tspan></text><path id="Line-Copy-8" fill="#EE6B47" fill-rule="nonzero" d="M186 71v22h6l-7 14-7-14h6V71h2z"/><path id="Rectangle-1-Copy-4" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M131 120h108v28H131z"/><text id=".then-copy" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="164" y="139">.then</tspan></text><path id="Line-Copy-9" fill="#EE6B47" fill-rule="nonzero" d="M113.746 70.107l1.147 1.639L75.542 99.29l3.441 4.916L63.5 106.5l7.455-13.763 3.44 4.914 39.35-27.544z"/><path id="Rectangle-1-Copy-5" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M255 120h108v28H255z"/><text id=".then-copy-2" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="287.5" y="139">.then</tspan></text><path id="Line-Copy-10" fill="#EE6B47" fill-rule="nonzero" d="M257.835 67.595L295.13 97.04l3.718-4.71 6.651 14.17-15.326-3.18 3.718-4.711-37.297-29.444 1.24-1.57z"/></g></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" width="373" height="152" viewBox="0 0 373 152"><defs><style>@import url(https://fonts.googleapis.com/css?family=Open+Sans:bold,italic,bolditalic%7CPT+Mono);@font-face{font-family:&apos;PT Mono&apos;;font-weight:700;font-style:normal;src:local(&apos;PT MonoBold&apos;),url(/font/PTMonoBold.woff2) format(&apos;woff2&apos;),url(/font/PTMonoBold.woff) format(&apos;woff&apos;),url(/font/PTMonoBold.ttf) format(&apos;truetype&apos;)}</style></defs><g id="promise" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><g id="promise-then-many.svg"><path id="Rectangle-1-Copy-3" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M10 120h108v28H10z"/><text id=".then" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="42.5" y="139">.then</tspan></text><path id="Rectangle-1-Copy-8" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M131 4h108v28H131z"/><text id="new-Promise" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="138.3" y="22">new Promise</tspan></text><text id="resolve(1)" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="142" y="54">resolve(1)</tspan></text><path id="Line-Copy-8" fill="#EE6B47" fill-rule="nonzero" d="M186 71v22h6l-7 14-7-14h6V71h2z"/><path id="Rectangle-1-Copy-4" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M131 120h108v28H131z"/><text id=".then-copy" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="164" y="139">.then</tspan></text><path id="Line-Copy-9" fill="#EE6B47" fill-rule="nonzero" d="M113.746 70.107l1.147 1.639-.82.573L75.542 99.29l3.441 4.916L63.5 106.5l7.455-13.763 3.441 4.915 38.53-26.971.82-.574z"/><path id="Rectangle-1-Copy-5" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M255 120h108v28H255z"/><text id=".then-copy-2" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="287.5" y="139">.then</tspan></text><path id="Line-Copy-10" fill="#EE6B47" fill-rule="nonzero" d="M257.835 67.595l.785.62L295.13 97.04l3.718-4.71 6.651 14.17-15.326-3.18 3.718-4.711-36.512-28.824-.785-.62 1.24-1.57z"/></g></g></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.2 KiB

After

Width:  |  Height:  |  Size: 2.2 KiB

Before After
Before After

2
1-js/11-async/04-promise-error-handling/promise-then-many.svg
View file

@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="373" height="152" viewBox="0 0 373 152"><defs><style>@import url(https://fonts.googleapis.com/css?family=Open+Sans:bold,italic,bolditalic%7CPT+Mono);@font-face{font-family:&apos;PT Mono&apos;;font-weight:700;font-style:normal;src:local(&apos;PT MonoBold&apos;),url(/font/PTMonoBold.woff2) format(&apos;woff2&apos;),url(/font/PTMonoBold.woff) format(&apos;woff&apos;),url(/font/PTMonoBold.ttf) format(&apos;truetype&apos;)}</style></defs><g id="promise" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><g id="promise-then-many.svg"><path id="Rectangle-1-Copy-3" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M10 120h108v28H10z"/><text id=".then" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="42.5" y="139">.then</tspan></text><path id="Rectangle-1-Copy-8" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M131 4h108v28H131z"/><text id="new-Promise" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="138.3" y="22">new Promise</tspan></text><text id="resolve(1)" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="142" y="54">resolve(1)</tspan></text><path id="Line-Copy-8" fill="#EE6B47" fill-rule="nonzero" d="M186 71v22h6l-7 14-7-14h6V71h2z"/><path id="Rectangle-1-Copy-4" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M131 120h108v28H131z"/><text id=".then-copy" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="164" y="139">.then</tspan></text><path id="Line-Copy-9" fill="#EE6B47" fill-rule="nonzero" d="M113.746 70.107l1.147 1.639L75.542 99.29l3.441 4.916L63.5 106.5l7.455-13.763 3.44 4.914 39.35-27.544z"/><path id="Rectangle-1-Copy-5" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M255 120h108v28H255z"/><text id=".then-copy-2" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="287.5" y="139">.then</tspan></text><path id="Line-Copy-10" fill="#EE6B47" fill-rule="nonzero" d="M257.835 67.595L295.13 97.04l3.718-4.71 6.651 14.17-15.326-3.18 3.718-4.711-37.297-29.444 1.24-1.57z"/></g></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" width="373" height="152" viewBox="0 0 373 152"><defs><style>@import url(https://fonts.googleapis.com/css?family=Open+Sans:bold,italic,bolditalic%7CPT+Mono);@font-face{font-family:&apos;PT Mono&apos;;font-weight:700;font-style:normal;src:local(&apos;PT MonoBold&apos;),url(/font/PTMonoBold.woff2) format(&apos;woff2&apos;),url(/font/PTMonoBold.woff) format(&apos;woff&apos;),url(/font/PTMonoBold.ttf) format(&apos;truetype&apos;)}</style></defs><g id="promise" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><g id="promise-then-many.svg"><path id="Rectangle-1-Copy-3" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M10 120h108v28H10z"/><text id=".then" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="42.5" y="139">.then</tspan></text><path id="Rectangle-1-Copy-8" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M131 4h108v28H131z"/><text id="new-Promise" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="138.3" y="22">new Promise</tspan></text><text id="resolve(1)" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="142" y="54">resolve(1)</tspan></text><path id="Line-Copy-8" fill="#EE6B47" fill-rule="nonzero" d="M186 71v22h6l-7 14-7-14h6V71h2z"/><path id="Rectangle-1-Copy-4" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M131 120h108v28H131z"/><text id=".then-copy" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="164" y="139">.then</tspan></text><path id="Line-Copy-9" fill="#EE6B47" fill-rule="nonzero" d="M113.746 70.107l1.147 1.639-.82.573L75.542 99.29l3.441 4.916L63.5 106.5l7.455-13.763 3.441 4.915 38.53-26.971.82-.574z"/><path id="Rectangle-1-Copy-5" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M255 120h108v28H255z"/><text id=".then-copy-2" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="287.5" y="139">.then</tspan></text><path id="Line-Copy-10" fill="#EE6B47" fill-rule="nonzero" d="M257.835 67.595l.785.62L295.13 97.04l3.718-4.71 6.651 14.17-15.326-3.18 3.718-4.711-36.512-28.824-.785-.62 1.24-1.57z"/></g></g></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.2 KiB

After

Width:  |  Height:  |  Size: 2.2 KiB

Before After
Before After

2
1-js/12-generators-iterators/1-generators/genYield2-2.svg
View file

File diff suppressed because one or more lines are too long
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 43 KiB

After

Width:  |  Height:  |  Size: 43 KiB

Before After
Before After

2
2-ui/1-document/01-browser-environment/windowObjects.svg
View file

@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="367" height="308" viewBox="0 0 367 308"><defs><style>@import url(https://fonts.googleapis.com/css?family=Open+Sans:bold,italic,bolditalic%7CPT+Mono);@font-face{font-family:&apos;PT Mono&apos;;font-weight:700;font-style:normal;src:local(&apos;PT MonoBold&apos;),url(/font/PTMonoBold.woff2) format(&apos;woff2&apos;),url(/font/PTMonoBold.woff) format(&apos;woff&apos;),url(/font/PTMonoBold.ttf) format(&apos;truetype&apos;)}</style></defs><g id="combined" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><g id="windowObjects.svg"><path id="Rectangle-1" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M136 10h78v28h-78z"/><text id="window" fill="#707175" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="152" y="28">window</tspan></text><path id="Rectangle-2" fill="#F5F4D8" stroke="#CFCE95" stroke-width="2" d="M18 80h78v26H18z"/><path id="Rectangle-2" fill="#FCDFE1" stroke="#C74A6C" stroke-width="2" d="M255 118h83v26h-83z"/><path id="Rectangle-2" fill="#EDFCFD" stroke="#99C0C3" stroke-width="2" d="M110 270h132v26H110z"/><text id="document" fill="#727155" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="26" y="97">document</tspan></text><path id="Rectangle-2" fill="#FCDFE1" stroke="#C74A6C" stroke-width="2" d="M255 80h83v26h-83z"/><text id="Object" fill="#924565" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="271" y="97">Object</tspan></text><path id="Rectangle-2" fill="#EDFCFD" stroke="#99C0C3" stroke-width="2" d="M134 80h85v26h-85z"/><text id="navigator" fill="#366378" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="138" y="97">navigator</tspan></text><path id="Rectangle-2" fill="#EDFCFD" stroke="#99C0C3" stroke-width="2" d="M134 118h85v26h-85z"/><text id="screen" fill="#366378" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="151" y="135">screen</tspan></text><path id="Rectangle-2" fill="#EDFCFD" stroke="#99C0C3" stroke-width="2" d="M134 156h85v26h-85z"/><text id="location" fill="#366378" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="142" y="173">location</tspan></text><path id="Rectangle-2" fill="#EDFCFD" stroke="#99C0C3" stroke-width="2" d="M134 194h85v26h-85z"/><text id="frames" fill="#366378" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="151" y="211">frames</tspan></text><path id="Rectangle-2" fill="#EDFCFD" stroke="#99C0C3" stroke-width="2" d="M134 232h85v26h-85z"/><text id="history" fill="#366378" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="147" y="249">history</tspan></text><text id="Array" fill="#924565" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="275" y="135">Array</tspan></text><path id="Rectangle-3" fill="#FCDFE1" stroke="#C74A6C" stroke-width="2" d="M255 156h83v26h-83z"/><text id="Function" fill="#924565" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="264" y="173">Function</tspan></text><text id="XMLHttpRequest" fill="#366378" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="117" y="287">XMLHttpRequest</tspan></text><text id="BOM" fill="#99C0C3" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="135" y="73">BOM</tspan></text><text id="JavaScript" fill="#C74A6C" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="271" y="73">JavaScript</tspan></text><text id="DOM" fill="#CFCE95" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="17" y="73">DOM</tspan></text><path id="Line" fill="#EE6B47" fill-rule="nonzero" d="M177.5 40.5v18h6l-7 14-7-14h6v-18h2z"/><path id="Line-2" fill="#EE6B47" fill-rule="nonzero" d="M132.75 40.108l1.142 1.642-35.328 24.575 3.426 4.926L86.5 73.5l7.495-13.741 3.426 4.925 35.329-24.576z"/><text id="…" fill="#727155" font-family="PTMono-Regular, PT Mono" font-size="24" font-weight="normal"><tspan x="50" y="122">…</tspan></text><text id="…-2" fill="#924565" font-family="PTMono-Regular, PT Mono" font-size="24" font-weight="normal"><tspan x="287" y="201">…</tspan></text><path id="Line" fill="#EE6B47" fill-rule="nonzero" d="M217.226 39.097l39.27 26.715 3.376-4.96 7.638 13.662-15.513-2.087 3.374-4.962-39.27-26.715 1.125-1.653z"/></g></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" width="367" height="308" viewBox="0 0 367 308"><defs><style>@import url(https://fonts.googleapis.com/css?family=Open+Sans:bold,italic,bolditalic%7CPT+Mono);@font-face{font-family:&apos;PT Mono&apos;;font-weight:700;font-style:normal;src:local(&apos;PT MonoBold&apos;),url(/font/PTMonoBold.woff2) format(&apos;woff2&apos;),url(/font/PTMonoBold.woff) format(&apos;woff&apos;),url(/font/PTMonoBold.ttf) format(&apos;truetype&apos;)}</style></defs><g id="combined" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><g id="windowObjects.svg"><path id="Rectangle-1" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M136 10h78v28h-78z"/><text id="window" fill="#707175" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="152" y="28">window</tspan></text><path id="Rectangle-2" fill="#F5F4D8" stroke="#CFCE95" stroke-width="2" d="M18 80h78v26H18z"/><path id="Rectangle-2" fill="#FCDFE1" stroke="#C74A6C" stroke-width="2" d="M255 118h83v26h-83z"/><path id="Rectangle-2" fill="#EDFCFD" stroke="#99C0C3" stroke-width="2" d="M110 270h132v26H110z"/><text id="document" fill="#727155" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="26" y="97">document</tspan></text><path id="Rectangle-2" fill="#FCDFE1" stroke="#C74A6C" stroke-width="2" d="M255 80h83v26h-83z"/><text id="Object" fill="#924565" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="271" y="97">Object</tspan></text><path id="Rectangle-2" fill="#EDFCFD" stroke="#99C0C3" stroke-width="2" d="M134 80h85v26h-85z"/><text id="navigator" fill="#366378" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="138" y="97">navigator</tspan></text><path id="Rectangle-2" fill="#EDFCFD" stroke="#99C0C3" stroke-width="2" d="M134 118h85v26h-85z"/><text id="screen" fill="#366378" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="151" y="135">screen</tspan></text><path id="Rectangle-2" fill="#EDFCFD" stroke="#99C0C3" stroke-width="2" d="M134 156h85v26h-85z"/><text id="location" fill="#366378" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="142" y="173">location</tspan></text><path id="Rectangle-2" fill="#EDFCFD" stroke="#99C0C3" stroke-width="2" d="M134 194h85v26h-85z"/><text id="frames" fill="#366378" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="151" y="211">frames</tspan></text><path id="Rectangle-2" fill="#EDFCFD" stroke="#99C0C3" stroke-width="2" d="M134 232h85v26h-85z"/><text id="history" fill="#366378" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="147" y="249">history</tspan></text><text id="Array" fill="#924565" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="275" y="135">Array</tspan></text><path id="Rectangle-3" fill="#FCDFE1" stroke="#C74A6C" stroke-width="2" d="M255 156h83v26h-83z"/><text id="Function" fill="#924565" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="264" y="173">Function</tspan></text><text id="XMLHttpRequest" fill="#366378" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="117" y="287">XMLHttpRequest</tspan></text><text id="BOM" fill="#99C0C3" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="135" y="73">BOM</tspan></text><text id="JavaScript" fill="#C74A6C" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="271" y="73">JavaScript</tspan></text><text id="DOM" fill="#CFCE95" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="17" y="73">DOM</tspan></text><path id="Line" fill="#EE6B47" fill-rule="nonzero" d="M177.5 40.5v18h6l-7 14-7-14h6v-18h2z"/><path id="Line-2" fill="#EE6B47" fill-rule="nonzero" d="M132.75 40.108l1.142 1.642-.82.57-34.508 24.005 3.426 4.926L86.5 73.5l7.495-13.741 3.426 4.924 34.508-24.004.82-.571z"/><text id="…" fill="#727155" font-family="PTMono-Regular, PT Mono" font-size="24" font-weight="normal"><tspan x="50" y="122">…</tspan></text><text id="…-2" fill="#924565" font-family="PTMono-Regular, PT Mono" font-size="24" font-weight="normal"><tspan x="287" y="201">…</tspan></text><path id="Line" fill="#EE6B47" fill-rule="nonzero" d="M217.226 39.097l.827.562 38.443 26.152 3.376-4.96 7.638 13.663-15.513-2.087 3.374-4.962-38.443-26.152-.827-.563 1.125-1.653z"/></g></g></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 4.4 KiB

After

Width:  |  Height:  |  Size: 4.4 KiB

Before After
Before After

2
2-ui/1-document/03-dom-navigation/dom-links-elements.svg
View file

@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="440" height="316" viewBox="0 0 440 316"><defs><style>@import url(https://fonts.googleapis.com/css?family=Open+Sans:bold,italic,bolditalic%7CPT+Mono);@font-face{font-family:&apos;PT Mono&apos;;font-weight:700;font-style:normal;src:local(&apos;PT MonoBold&apos;),url(/font/PTMonoBold.woff2) format(&apos;woff2&apos;),url(/font/PTMonoBold.woff) format(&apos;woff&apos;),url(/font/PTMonoBold.ttf) format(&apos;truetype&apos;)}</style></defs><g id="dom" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><g id="dom-links-elements.svg"><path id="Rectangle-8" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M129 10h198v28H129z"/><text id="document.documentEle" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="12" font-weight="normal"><tspan x="142.6" y="29">document.documentElement </tspan></text><text id="Type-something" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="12" font-weight="normal"><tspan x="336.9" y="29">&lt;HTML&gt;</tspan></text><path id="Rectangle-7" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M163 78h117v28H163z"/><text id="document.body--" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="12" font-weight="normal"><tspan x="174.2" y="95">document.body </tspan></text><text id="(if-inside-body)" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="12" font-weight="normal"><tspan x="300.9" y="95">(if inside body)</tspan></text><path id="Line-5" stroke="#8A704D" stroke-linecap="square" stroke-width="2" d="M14.5 115H427"/><text id="parentElement" font-family="PTMono-Regular, PT Mono" font-size="12" font-weight="normal"><tspan x="175" y="172" fill="#8A704D">parent</tspan> <tspan x="218.2" y="172" fill="#EE6B47">Element</tspan></text><path id="Rectangle-6" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M180 213h80v28h-80z"/><text id="&lt;DIV&gt;" fill="#8A704D" font-family="OpenSans-Regular, Open Sans" font-size="12" font-weight="normal"><tspan x="204.192" y="232">&lt;DIV&gt;</tspan></text><path id="Line-6" fill="#EE6B47" fill-rule="nonzero" d="M220.5 178.71l8.112 14.421-1.743.98-5.369-9.543V208.5h-2v-23.935l-5.369 9.547-1.743-.98 8.112-14.422z"/><path id="Line-7" fill="#EE6B47" fill-rule="nonzero" d="M415.369 218.388l14.42 8.112-14.42 8.112-.98-1.743 9.542-5.369H266.5v-2h157.434l-9.546-5.369.98-1.743z"/><text id="nextElementSibling" font-family="PTMono-Regular, PT Mono" font-size="12" font-weight="normal"><tspan x="276" y="212" fill="#8A704D">next</tspan> <tspan x="304.8" y="212" fill="#EE6B47">Element</tspan> <tspan x="355.2" y="212" fill="#8A704D">Sibling</tspan></text><path id="Line-8" fill="#EE6B47" fill-rule="nonzero" d="M23.631 218.388l.98 1.743-9.544 5.369H169v2H15.067l9.545 5.369-.98 1.743L9.21 226.5l14.421-8.112z"/><text id="previousElementSibli" font-family="PTMono-Regular, PT Mono" font-size="12" font-weight="normal"><tspan x="6" y="212" fill="#8A704D">previous</tspan> <tspan x="63.6" y="212" fill="#EE6B47">Element</tspan> <tspan x="114" y="212" fill="#8A704D">Sibling</tspan></text><path id="Line" fill="#EE6B47" fill-rule="nonzero" d="M174.822 248.123l1.055 1.7-56.244 34.908 10.941-.47.086 1.997-16.53.713 7.975-14.497 1.752.964-5.279 9.595 56.244-34.91z"/><path id="Line-3" fill="#EE6B47" fill-rule="nonzero" d="M269.214 248.115l53.772 35.364-5.024-9.73 1.777-.918 7.592 14.702-16.506-1.147.138-1.995 10.924.759-53.772-35.364 1.099-1.671z"/><text id="children" fill="#EE6B47" font-family="PTMono-Regular, PT Mono" font-size="12" font-weight="normal"><tspan x="188" y="273">children</tspan></text><text id="firstElementChild--" font-family="PTMono-Regular, PT Mono" font-size="12" font-weight="normal"><tspan x="43" y="307" fill="#8A704D">first</tspan> <tspan x="79" y="307" fill="#EE6B47">Element</tspan> <tspan x="129.4" y="307" fill="#8A704D">Child </tspan></text><text id="lastElementChild" font-family="PTMono-Regular, PT Mono" font-size="12" font-weight="normal"><tspan x="273" y="307" fill="#8A704D">last</tspan> <tspan x="301.8" y="307" fill="#EE6B47">Element</tspan> <tspan x="352.2" y="307" fill="#8A704D">Child</tspan></text><path id="Line-Copy-2" fill="#EE6B47" fill-rule="nonzero" d="M222.5 151.5v4h-2v-4h2zm0-6v4h-2v-4h2zm0-6v4h-2v-4h2zm-1-14.29l8.112 14.421-1.743.98-5.37-9.544.001.433h-2l-.001-.433-5.368 9.545-1.743-.98 8.112-14.422zm1 8.29v4h-2v-4h2z"/><path id="Line-2-Copy" fill="#EE6B47" fill-rule="nonzero" d="M221.5 44.71l8.112 14.421-1.743.98-5.369-9.544v21.528h-2V50.567l-5.369 9.545-1.743-.98L221.5 44.71z"/></g></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" width="440" height="316" viewBox="0 0 440 316"><defs><style>@import url(https://fonts.googleapis.com/css?family=Open+Sans:bold,italic,bolditalic%7CPT+Mono);@font-face{font-family:&apos;PT Mono&apos;;font-weight:700;font-style:normal;src:local(&apos;PT MonoBold&apos;),url(/font/PTMonoBold.woff2) format(&apos;woff2&apos;),url(/font/PTMonoBold.woff) format(&apos;woff&apos;),url(/font/PTMonoBold.ttf) format(&apos;truetype&apos;)}</style></defs><g id="dom" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><g id="dom-links-elements.svg"><path id="Rectangle-8" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M129 10h198v28H129z"/><text id="document.documentEle" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="12" font-weight="normal"><tspan x="142.6" y="29">document.documentElement </tspan></text><text id="Type-something" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="12" font-weight="normal"><tspan x="336.9" y="29">&lt;HTML&gt;</tspan></text><path id="Rectangle-7" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M163 78h117v28H163z"/><text id="document.body--" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="12" font-weight="normal"><tspan x="174.2" y="95">document.body </tspan></text><text id="(if-inside-body)" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="12" font-weight="normal"><tspan x="300.9" y="95">(if inside body)</tspan></text><path id="Line-5" stroke="#8A704D" stroke-linecap="square" stroke-width="2" d="M14.5 115H427"/><text id="parentElement" font-family="PTMono-Regular, PT Mono" font-size="12" font-weight="normal"><tspan x="175" y="172" fill="#8A704D">parent</tspan> <tspan x="218.2" y="172" fill="#EE6B47">Element</tspan></text><path id="Rectangle-6" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M180 213h80v28h-80z"/><text id="&lt;DIV&gt;" fill="#8A704D" font-family="OpenSans-Regular, Open Sans" font-size="12" font-weight="normal"><tspan x="204.192" y="232">&lt;DIV&gt;</tspan></text><path id="Line-6" fill="#EE6B47" fill-rule="nonzero" d="M220.5 178.71l.872 1.55 6.75 12 .49.871-1.743.98-.49-.87-4.879-8.674V208.5h-2v-23.933l-4.878 8.673-.49.872-1.744-.98.49-.872 6.75-12 .872-1.55z"/><path id="Line-7" fill="#EE6B47" fill-rule="nonzero" d="M415.369 218.388l.871.49 12 6.75 1.55.872-1.55.872-12 6.75-.871.49-.98-1.743.87-.49 8.673-4.879H266.5v-2h157.432l-8.672-4.878-.872-.49.98-1.744z"/><text id="nextElementSibling" font-family="PTMono-Regular, PT Mono" font-size="12" font-weight="normal"><tspan x="276" y="212" fill="#8A704D">next</tspan> <tspan x="304.8" y="212" fill="#EE6B47">Element</tspan> <tspan x="355.2" y="212" fill="#8A704D">Sibling</tspan></text><path id="Line-8" fill="#EE6B47" fill-rule="nonzero" d="M23.631 218.388l.98 1.743-.87.49-8.674 4.879H169v2H15.067l8.673 4.878.872.49-.98 1.744-.872-.49-12-6.75-1.55-.872 1.55-.872 12-6.75.871-.49z"/><text id="previousElementSibli" font-family="PTMono-Regular, PT Mono" font-size="12" font-weight="normal"><tspan x="6" y="212" fill="#8A704D">previous</tspan> <tspan x="63.6" y="212" fill="#EE6B47">Element</tspan> <tspan x="114" y="212" fill="#8A704D">Sibling</tspan></text><path id="Line" fill="#EE6B47" fill-rule="nonzero" d="M174.822 248.123l1.055 1.7-.85.527-48.476 30.089-6.917 4.292 9.941-.428 1-.043.085 1.998-.999.043-13.755.594-1.776.076.857-1.557 6.636-12.064.482-.876 1.752.964-.482.876-4.797 8.718 6.918-4.293 48.477-30.089.85-.527z"/><path id="Line-3" fill="#EE6B47" fill-rule="nonzero" d="M269.214 248.115l.835.55 46.157 30.354 6.78 4.46-4.565-8.841-.459-.889 1.777-.918.459.889 6.317 12.233.816 1.58-1.774-.123-13.735-.954-.997-.07.138-1.995.998.07 9.926.689-6.78-4.46-46.156-30.354-.836-.55 1.099-1.671z"/><text id="children" fill="#EE6B47" font-family="PTMono-Regular, PT Mono" font-size="12" font-weight="normal"><tspan x="188" y="273">children</tspan></text><text id="firstElementChild--" font-family="PTMono-Regular, PT Mono" font-size="12" font-weight="normal"><tspan x="43" y="307" fill="#8A704D">first</tspan> <tspan x="79" y="307" fill="#EE6B47">Element</tspan> <tspan x="129.4" y="307" fill="#8A704D">Child </tspan></text><text id="lastElementChild" font-family="PTMono-Regular, PT Mono" font-size="12" font-weight="normal"><tspan x="273" y="307" fill="#8A704D">last</tspan> <tspan x="301.8" y="307" fill="#EE6B47">Element</tspan> <tspan x="352.2" y="307" fill="#8A704D">Child</tspan></text><path id="Line-Copy-2" fill="#EE6B47" fill-rule="nonzero" d="M222.5 151.5v4h-2v-4h2zm0-6v4h-2v-4h2zm0-6v4h-2v-4h2zm-1-14.29l.872 1.55 6.75 12 .49.871-1.743.98-.49-.87-4.88-8.676.001.435h-2l-.001-.432-4.877 8.672-.49.872-1.744-.98.49-.872 6.75-12 .872-1.55zm1 8.29v4h-2v-4h2z"/><path id="Line-2-Copy" fill="#EE6B47" fill-rule="nonzero" d="M221.5 44.71l.872 1.55 6.75 12 .49.871-1.743.98-.49-.87-4.879-8.674v21.528h-2V50.567l-4.878 8.673-.49.872-1.744-.98.49-.872 6.75-12 .872-1.55z"/></g></g></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 4.4 KiB

After

Width:  |  Height:  |  Size: 4.8 KiB

Before After
Before After

2
2-ui/1-document/03-dom-navigation/dom-links.svg
View file

@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="420" height="388" viewBox="0 0 420 388"><defs><style>@import url(https://fonts.googleapis.com/css?family=Open+Sans:bold,italic,bolditalic%7CPT+Mono);@font-face{font-family:&apos;PT Mono&apos;;font-weight:700;font-style:normal;src:local(&apos;PT MonoBold&apos;),url(/font/PTMonoBold.woff2) format(&apos;woff2&apos;),url(/font/PTMonoBold.woff) format(&apos;woff&apos;),url(/font/PTMonoBold.ttf) format(&apos;truetype&apos;)}</style></defs><g id="dom" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><g id="dom-links.svg"><path id="Rectangle-9" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M150 20h117v28H150z"/><path id="Rectangle-7" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M151 154h117v28H151z"/><path id="Rectangle-8" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M117 87h198v28H117z"/><text id="document" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="12" font-weight="normal"><tspan x="179.7" y="38">document</tspan></text><text id="document.documentEle" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="12" font-weight="normal"><tspan x="129.6" y="105">document.documentElement </tspan></text><text id="Type-something" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="12" font-weight="normal"><tspan x="324.9" y="105">&lt;HTML&gt;</tspan></text><text id="document.body--" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="12" font-weight="normal"><tspan x="164.2" y="173">document.body </tspan></text><text id="(if-inside-body)" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="12" font-weight="normal"><tspan x="283.9" y="173">(if inside body)</tspan></text><path id="Line" fill="#EE6B47" fill-rule="nonzero" d="M209.5 119.71l8.112 14.421-1.743.98-5.369-9.544v23.785h-2v-23.785l-5.369 9.545-1.743-.98 8.112-14.422z"/><path id="Line-2" fill="#EE6B47" fill-rule="nonzero" d="M209.5 52.71l8.112 14.421-1.743.98-5.369-9.543v21.527h-2v-21.53l-5.369 9.547-1.743-.98L209.5 52.71z"/><path id="Line" stroke="#8A704D" stroke-linecap="square" stroke-width="2" d="M2.5 191H415"/><text id="parentNode" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="12" font-weight="normal"><tspan x="172" y="248">parentNode</tspan></text><path id="Rectangle-6" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M169 289h80v28h-80z"/><text id="&lt;DIV&gt;" fill="#8A704D" font-family="OpenSans-Regular, Open Sans" font-size="12" font-weight="normal"><tspan x="192.192" y="308">&lt;DIV&gt;</tspan></text><path id="Line" fill="#EE6B47" fill-rule="nonzero" d="M208.5 254.21l8.112 14.421-1.743.98-5.37-9.546.001 24.435h-2l-.001-24.432-5.368 9.544-1.743-.98 8.112-14.422z"/><path id="Line-Copy" fill="#EE6B47" fill-rule="nonzero" d="M209.5 226.5v4h-2v-4h2zm0-6v4h-2v-4h2zm0-6v4h-2v-4h2zm-1-14.29l8.112 14.421-1.743.98-5.37-9.544.001.433h-2l-.001-.433-5.368 9.545-1.743-.98 8.112-14.422zm1 8.29v4h-2v-4h2z"/><path id="Line" fill="#EE6B47" fill-rule="nonzero" d="M356.369 294.388l14.42 8.112-14.42 8.112-.98-1.743 9.543-5.369H254.5v-2h110.432l-9.544-5.369.98-1.743z"/><text id="nextSibling" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="12" font-weight="normal"><tspan x="264" y="288">nextSibling</tspan></text><path id="Line" fill="#EE6B47" fill-rule="nonzero" d="M61.631 294.388l.98 1.743-9.544 5.369H165.5v2H53.067l9.545 5.369-.98 1.743L47.21 302.5l14.421-8.112z"/><text id="previousSibling" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="12" font-weight="normal"><tspan x="50" y="288">previousSibling</tspan></text><path id="Line" fill="#EE6B47" fill-rule="nonzero" d="M162.822 324.123l1.055 1.7-56.244 34.908 10.941-.47.086 1.997-16.53.713 7.975-14.497 1.752.964-5.279 9.595 56.244-34.91z"/><path id="Line-3" fill="#EE6B47" fill-rule="nonzero" d="M257.214 324.115l53.772 35.364-5.024-9.73 1.777-.918 7.592 14.702-16.506-1.147.138-1.995 10.924.759-53.772-35.364 1.099-1.671z"/><text id="childNodes" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="12" font-weight="normal"><tspan x="170" y="343">childNodes</tspan></text><text id="firstChild--" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="12" font-weight="normal"><tspan x="64" y="379">firstChild </tspan></text><text id="Type-something" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="12" font-weight="normal"><tspan x="279" y="379">lastChild</tspan></text></g></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" width="420" height="388" viewBox="0 0 420 388"><defs><style>@import url(https://fonts.googleapis.com/css?family=Open+Sans:bold,italic,bolditalic%7CPT+Mono);@font-face{font-family:&apos;PT Mono&apos;;font-weight:700;font-style:normal;src:local(&apos;PT MonoBold&apos;),url(/font/PTMonoBold.woff2) format(&apos;woff2&apos;),url(/font/PTMonoBold.woff) format(&apos;woff&apos;),url(/font/PTMonoBold.ttf) format(&apos;truetype&apos;)}</style></defs><g id="dom" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><g id="dom-links.svg"><path id="Rectangle-9" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M150 20h117v28H150z"/><path id="Rectangle-7" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M151 154h117v28H151z"/><path id="Rectangle-8" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M117 87h198v28H117z"/><text id="document" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="12" font-weight="normal"><tspan x="179.7" y="38">document</tspan></text><text id="document.documentEle" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="12" font-weight="normal"><tspan x="129.6" y="105">document.documentElement </tspan></text><text id="Type-something" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="12" font-weight="normal"><tspan x="324.9" y="105">&lt;HTML&gt;</tspan></text><text id="document.body--" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="12" font-weight="normal"><tspan x="164.2" y="173">document.body </tspan></text><text id="(if-inside-body)" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="12" font-weight="normal"><tspan x="283.9" y="173">(if inside body)</tspan></text><path id="Line" fill="#EE6B47" fill-rule="nonzero" d="M209.5 119.71l.872 1.55 6.75 12 .49.871-1.743.98-.49-.87-4.879-8.674v23.785h-2v-23.785l-4.878 8.673-.49.872-1.744-.98.49-.872 6.75-12 .872-1.55z"/><path id="Line-2" fill="#EE6B47" fill-rule="nonzero" d="M209.5 52.71l.872 1.55 6.75 12 .49.871-1.743.98-.49-.87-4.879-8.674v21.528h-2V58.567l-4.878 8.673-.49.872-1.744-.98.49-.872 6.75-12 .872-1.55z"/><path id="Line" stroke="#8A704D" stroke-linecap="square" stroke-width="2" d="M2.5 191H415"/><text id="parentNode" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="12" font-weight="normal"><tspan x="172" y="248">parentNode</tspan></text><path id="Rectangle-6" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M169 289h80v28h-80z"/><text id="&lt;DIV&gt;" fill="#8A704D" font-family="OpenSans-Regular, Open Sans" font-size="12" font-weight="normal"><tspan x="192.192" y="308">&lt;DIV&gt;</tspan></text><path id="Line" fill="#EE6B47" fill-rule="nonzero" d="M208.5 254.21l.872 1.55 6.75 12 .49.871-1.743.98-.49-.87-4.88-8.676.001 8.185v16.25h-2v-16.25l-.001-8.182-4.877 8.672-.49.872-1.744-.98.49-.872 6.75-12 .872-1.55z"/><path id="Line-Copy" fill="#EE6B47" fill-rule="nonzero" d="M209.5 226.5v4h-2v-4h2zm0-6v4h-2v-4h2zm0-6v4h-2v-4h2zm-1-14.29l.872 1.55 6.75 12 .49.871-1.743.98-.49-.87-4.88-8.676.001.435h-2l-.001-.432-4.877 8.672-.49.872-1.744-.98.49-.872 6.75-12 .872-1.55zm1 8.29v4h-2v-4h2z"/><path id="Line" fill="#EE6B47" fill-rule="nonzero" d="M356.369 294.388l.871.49 12 6.75 1.55.872-1.55.872-12 6.75-.871.49-.98-1.743.87-.49 8.673-4.879H254.5v-2h110.432l-8.672-4.878-.872-.49.98-1.744z"/><text id="nextSibling" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="12" font-weight="normal"><tspan x="264" y="288">nextSibling</tspan></text><path id="Line" fill="#EE6B47" fill-rule="nonzero" d="M61.631 294.388l.98 1.743-.87.49-8.674 4.879H165.5v2H53.067l8.673 4.878.872.49-.98 1.744-.872-.49-12-6.75-1.55-.872 1.55-.872 12-6.75.871-.49z"/><text id="previousSibling" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="12" font-weight="normal"><tspan x="50" y="288">previousSibling</tspan></text><path id="Line" fill="#EE6B47" fill-rule="nonzero" d="M162.822 324.123l1.055 1.7-.85.527-48.476 30.089-6.917 4.292 9.941-.428 1-.043.085 1.998-.999.043-13.755.594-1.776.076.857-1.557 6.636-12.064.482-.876 1.752.964-.482.876-4.797 8.718 6.918-4.293 48.477-30.089.85-.527z"/><path id="Line-3" fill="#EE6B47" fill-rule="nonzero" d="M257.214 324.115l.835.55 46.157 30.354 6.78 4.46-4.565-8.841-.459-.889 1.777-.918.459.889 6.317 12.233.816 1.58-1.774-.123-13.735-.954-.997-.07.138-1.995.998.07 9.926.689-6.78-4.46-46.156-30.354-.836-.55 1.099-1.671z"/><text id="childNodes" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="12" font-weight="normal"><tspan x="170" y="343">childNodes</tspan></text><text id="firstChild--" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="12" font-weight="normal"><tspan x="64" y="379">firstChild </tspan></text><text id="Type-something" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="12" font-weight="normal"><tspan x="279" y="379">lastChild</tspan></text></g></g></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 4.4 KiB

After

Width:  |  Height:  |  Size: 4.8 KiB

Before After
Before After

2
2-ui/1-document/05-basic-dom-node-properties/dom-class-hierarchy.svg
View file

File diff suppressed because one or more lines are too long
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 5.8 KiB

After

Width:  |  Height:  |  Size: 5.9 KiB

Before After
Before After

2
2-ui/1-document/07-modifying-document/before-prepend-append-after.svg
View file

File diff suppressed because one or more lines are too long
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 12 KiB

After

Width:  |  Height:  |  Size: 12 KiB

Before After
Before After

2
2-ui/1-document/07-modifying-document/insert-adjacent.svg
View file

File diff suppressed because one or more lines are too long
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 12 KiB

After

Width:  |  Height:  |  Size: 12 KiB

Before After
Before After

2
2-ui/1-document/09-size-and-scroll/4-put-ball-in-center/field.svg
View file

File diff suppressed because one or more lines are too long
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 7.8 KiB

After

Width:  |  Height:  |  Size: 7.8 KiB

Before After
Before After

2
2-ui/1-document/09-size-and-scroll/metric-all.svg
View file

File diff suppressed because one or more lines are too long
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 11 KiB

After

Width:  |  Height:  |  Size: 11 KiB

Before After
Before After

2
2-ui/1-document/11-coordinates/coordinates-negative.svg
View file

@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="521" height="355" viewBox="0 0 521 355"><defs><style>@import url(https://fonts.googleapis.com/css?family=Open+Sans:bold,italic,bolditalic%7CPT+Mono);@font-face{font-family:&apos;PT Mono&apos;;font-weight:700;font-style:normal;src:local(&apos;PT MonoBold&apos;),url(/font/PTMonoBold.woff2) format(&apos;woff2&apos;),url(/font/PTMonoBold.woff) format(&apos;woff&apos;),url(/font/PTMonoBold.ttf) format(&apos;truetype&apos;)}</style></defs><defs><filter id="filter-1" width="118%" height="209.1%" x="-9%" y="-54.5%" filterUnits="objectBoundingBox"><feGaussianBlur in="SourceGraphic" stdDeviation="4"/></filter></defs><g id="dom" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><g id="coordinates-negative.svg"><g id="noun_69008_cc" fill="#E8C48E" transform="translate(13 11)"><path id="Shape" d="M455.313 330H9.688C4.34 330 0 326.288 0 321.75V8.25C0 3.713 4.34 0 9.688 0h445.625C460.64 0 465 3.712 465 8.25v313.5c0 4.538-4.36 8.25-9.688 8.25zM9.432 318.939h444.25V11.06H9.432V318.94z"/><path id="Shape" d="M19.674 46C14.334 46 10 44.875 10 43.5s4.334-2.5 9.674-2.5h425.652c5.32 0 9.674 1.125 9.674 2.5s-4.353 2.5-9.674 2.5H19.674zM31 27.5c0 3.039-2.461 5.5-5.5 5.5a5.498 5.498 0 01-5.5-5.5c0-3.039 2.461-5.5 5.5-5.5s5.5 2.461 5.5 5.5zM59 27.5c0 3.039-2.461 5.5-5.5 5.5a5.498 5.498 0 01-5.5-5.5c0-3.039 2.461-5.5 5.5-5.5s5.5 2.461 5.5 5.5zM87 27.5c0 3.039-2.461 5.5-5.5 5.5a5.498 5.498 0 01-5.5-5.5c0-3.039 2.461-5.5 5.5-5.5s5.5 2.461 5.5 5.5z"/></g><text id="bottom" fill="#999" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold"><tspan x="414" y="196">bottom</tspan></text><path id="Line-30-Copy-2" stroke="#EE6B47" stroke-dasharray="3,6" stroke-linecap="square" stroke-width="2" d="M392.5 290v37"/><path id="Line-29-Copy" stroke="#EE6B47" stroke-dasharray="3,6" stroke-linecap="square" stroke-width="2" d="M394 288h69"/><text id="(x,y)" fill="#EE6B47" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold"><tspan x="395" y="305">(x,y)</tspan></text><text id="(x,y)-copy" fill="#EE6B47" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold"><tspan x="395" y="305">(x,y)</tspan></text><text id="left" fill="#999" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold"><tspan x="50" y="129">left</tspan></text><path id="Line-Copy" fill="#999" fill-rule="nonzero" d="M410 56.5v213h8l-9.5 19-9.5-19h8v-213h3z"/><text id="right" fill="#999" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold"><tspan x="188" y="323">right</tspan></text><path id="Line-3-Copy-2" fill="#999" fill-rule="nonzero" d="M371.498 295.5l19 9.5-19 9.5-.001-8H21.502v-3h349.995v-8z"/><path id="Rectangle-1" fill="#E8C48F" fill-opacity=".88" d="M393 113v175H118V113h275zm-10.643 10H129.015v155h253.342V123z"/><text id="Introduction-This-Ec" fill="#5A4739" font-family="OpenSans-Bold, Open Sans" font-size="16" font-weight="bold" opacity=".7"><tspan x="139" y="148">Introduction</tspan> <tspan x="139" y="176" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal">This Ecma Standard is based on </tspan> <tspan x="139" y="195" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal">several originating technologies, </tspan> <tspan x="139" y="214" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal">the most well known being </tspan> <tspan x="139" y="233" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal">JavaScript (Netscape) and JScript </tspan> <tspan x="139" y="252" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal">(Microsoft). The language was </tspan> <tspan x="139" y="271" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal">invented by Brendan Eich at </tspan></text><text id="top" fill="#999" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold"><tspan x="125" y="90">top</tspan></text><path id="Line-3" fill="#999" fill-rule="nonzero" d="M100.548 104.403l18.95 9.6-19.05 9.4.041-8.001-78-.41.017-3 77.999.41.043-8z"/><path id="Line-2" fill="#EE6B47" fill-rule="nonzero" d="M118.076 113.232l21.132 2.162-4.288 6.754 257.148 163.24-1.608 2.532-257.148-163.239-4.287 6.754-10.95-18.203z"/><path id="Line-3-Copy" fill="#999" fill-rule="nonzero" d="M118.998 56.5L119 94.499h8l-9.498 19.001-9.501-19H116l-.002-38h3z"/><g id="Group" transform="rotate(32.5 -148.357 454.177)"><path id="Rectangle" fill="#FFF" d="M0 0h133v22H0z" filter="url(#filter-1)"/><text id="(width,height)" fill="#EE6B47" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold"><tspan x="8.682" y="15.378">(width,height)</tspan></text></g></g></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" width="521" height="355" viewBox="0 0 521 355"><defs><style>@import url(https://fonts.googleapis.com/css?family=Open+Sans:bold,italic,bolditalic%7CPT+Mono);@font-face{font-family:&apos;PT Mono&apos;;font-weight:700;font-style:normal;src:local(&apos;PT MonoBold&apos;),url(/font/PTMonoBold.woff2) format(&apos;woff2&apos;),url(/font/PTMonoBold.woff) format(&apos;woff&apos;),url(/font/PTMonoBold.ttf) format(&apos;truetype&apos;)}</style></defs><defs><filter id="filter-1" width="118%" height="209.1%" x="-9%" y="-54.5%" filterUnits="objectBoundingBox"><feGaussianBlur in="SourceGraphic" stdDeviation="4"/></filter></defs><g id="dom" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><g id="coordinates-negative.svg"><g id="noun_69008_cc" fill="#E8C48E" transform="translate(13 11)"><path id="Shape" d="M455.313 330H9.688C4.34 330 0 326.288 0 321.75V8.25C0 3.713 4.34 0 9.688 0h445.625C460.64 0 465 3.712 465 8.25v313.5c0 4.538-4.36 8.25-9.688 8.25zM9.432 318.939h444.25V11.06H9.432V318.94z"/><path id="Shape" d="M19.674 46C14.334 46 10 44.875 10 43.5s4.334-2.5 9.674-2.5h425.652c5.32 0 9.674 1.125 9.674 2.5s-4.353 2.5-9.674 2.5H19.674zM31 27.5c0 3.039-2.461 5.5-5.5 5.5a5.498 5.498 0 01-5.5-5.5c0-3.039 2.461-5.5 5.5-5.5s5.5 2.461 5.5 5.5zM59 27.5c0 3.039-2.461 5.5-5.5 5.5a5.498 5.498 0 01-5.5-5.5c0-3.039 2.461-5.5 5.5-5.5s5.5 2.461 5.5 5.5zM87 27.5c0 3.039-2.461 5.5-5.5 5.5a5.498 5.498 0 01-5.5-5.5c0-3.039 2.461-5.5 5.5-5.5s5.5 2.461 5.5 5.5z"/></g><text id="bottom" fill="#999" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold"><tspan x="414" y="196">bottom</tspan></text><path id="Line-30-Copy-2" stroke="#EE6B47" stroke-dasharray="3,6" stroke-linecap="square" stroke-width="2" d="M392.5 290v37"/><path id="Line-29-Copy" stroke="#EE6B47" stroke-dasharray="3,6" stroke-linecap="square" stroke-width="2" d="M394 288h69"/><text id="(x,y)" fill="#EE6B47" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold"><tspan x="395" y="305">(x,y)</tspan></text><text id="(x,y)-copy" fill="#EE6B47" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold"><tspan x="395" y="305">(x,y)</tspan></text><text id="left" fill="#999" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold"><tspan x="50" y="129">left</tspan></text><path id="Line-Copy" fill="#999" fill-rule="nonzero" d="M410 56.5v213h8l-9.5 19-9.5-19h8v-213h3z"/><text id="right" fill="#999" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold"><tspan x="188" y="323">right</tspan></text><path id="Line-3-Copy-2" fill="#999" fill-rule="nonzero" d="M371.498 295.5l19 9.5-19 9.5-.001-8H21.502v-3h349.995v-8z"/><path id="Rectangle-1" fill="#E8C48F" fill-opacity=".88" d="M393 113v175H118V113h275zm-10.643 10H129.015v155h253.342V123z"/><text id="Introduction-This-Ec" fill="#5A4739" font-family="OpenSans-Bold, Open Sans" font-size="16" font-weight="bold" opacity=".7"><tspan x="139" y="148">Introduction</tspan> <tspan x="139" y="176" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal">This Ecma Standard is based on </tspan> <tspan x="139" y="195" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal">several originating technologies, </tspan> <tspan x="139" y="214" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal">the most well known being </tspan> <tspan x="139" y="233" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal">JavaScript (Netscape) and JScript </tspan> <tspan x="139" y="252" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal">(Microsoft). The language was </tspan> <tspan x="139" y="271" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal">invented by Brendan Eich at </tspan></text><text id="top" fill="#999" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold"><tspan x="125" y="90">top</tspan></text><path id="Line-3" fill="#999" fill-rule="nonzero" d="M100.548 104.403l18.95 9.6-19.05 9.4.041-8.001-76.5-.402-1.5-.008.017-3 1.5.008 76.499.402.043-8z"/><path id="Line-2" fill="#EE6B47" fill-rule="nonzero" d="M118.076 113.232l21.132 2.162-4.288 6.754 255.882 162.436 1.266.804-1.608 2.532-1.266-.804-255.882-162.435-4.287 6.754-10.95-18.203z"/><path id="Line-3-Copy" fill="#999" fill-rule="nonzero" d="M118.998 56.5V58L119 94.499h8l-9.498 19.001-9.501-19H116l-.002-36.5v-1.5h3z"/><g id="Group" transform="rotate(32.5 -148.357 454.177)"><path id="Rectangle" fill="#FFF" d="M0 0h133v22H0z" filter="url(#filter-1)"/><text id="(width,height)" fill="#EE6B47" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold"><tspan x="8.682" y="15.378">(width,height)</tspan></text></g></g></g></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 4.6 KiB

After

Width:  |  Height:  |  Size: 4.7 KiB

Before After
Before After

2
2-ui/1-document/11-coordinates/coordinates.svg
View file

@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="521" height="411" viewBox="0 0 521 411"><defs><style>@import url(https://fonts.googleapis.com/css?family=Open+Sans:bold,italic,bolditalic%7CPT+Mono);@font-face{font-family:&apos;PT Mono&apos;;font-weight:700;font-style:normal;src:local(&apos;PT MonoBold&apos;),url(/font/PTMonoBold.woff2) format(&apos;woff2&apos;),url(/font/PTMonoBold.woff) format(&apos;woff&apos;),url(/font/PTMonoBold.ttf) format(&apos;truetype&apos;)}</style></defs><g id="dom" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><g id="coordinates.svg"><g id="noun_69008_cc" fill="#E8C48E" transform="translate(13 11)"><path id="Shape" d="M490.563 386H10.438C4.676 386 0 381.658 0 376.35V9.65C0 4.342 4.676 0 10.438 0h480.125C496.303 0 501 4.343 501 9.65v366.7c0 5.308-4.697 9.65-10.438 9.65zm-480.4-12.939h478.642V12.94H10.162V373.06z"/><path id="Shape" d="M20.859 54.1c-5.753 0-10.422-1.147-10.422-2.55 0-1.402 4.67-2.55 10.422-2.55H479.4c5.732 0 10.422 1.148 10.422 2.55 0 1.403-4.69 2.55-10.422 2.55H20.86zM33.8 31.627a6.024 6.024 0 11-12.05 0 6.024 6.024 0 1112.05 0zM63.988 31.627a6.024 6.024 0 11-12.05 0 6.024 6.024 0 1112.05 0zM94.177 31.627a6.024 6.024 0 11-12.05 0 6.024 6.024 0 1112.05 0z"/></g><text id="height" fill="#EE6B47" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold"><tspan x="417" y="208">height</tspan></text><text id="bottom" fill="#999" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold"><tspan x="451" y="311">bottom</tspan></text><path id="Line-28" stroke="#EE6B47" stroke-dasharray="3,6" stroke-linecap="square" stroke-width="2" d="M395 293h103"/><path id="Line-30" stroke="#EE6B47" stroke-dasharray="3,6" stroke-linecap="square" stroke-width="2" d="M392 296v74.5"/><path id="Line-30-Copy" stroke="#EE6B47" stroke-dasharray="3,6" stroke-linecap="square" stroke-width="2" d="M119 296v46"/><path id="Line-29" stroke="#EE6B47" stroke-dasharray="3,6" stroke-linecap="square" stroke-width="2" d="M396 120h30"/><text id="x" fill="#EE6B47" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold"><tspan x="62" y="113">x</tspan></text><text id="left" fill="#999" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold"><tspan x="50" y="135">left</tspan></text><text id="y" fill="#EE6B47" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold"><tspan x="125" y="79">y</tspan></text><text id="width" fill="#EE6B47" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold"><tspan x="234" y="339">width</tspan></text><path id="Line" fill="#EE6B47" fill-rule="nonzero" d="M414 118.5V273h8l-9.5 19-9.5-19h8V118.5h3z"/><path id="Line-Copy" fill="#999" fill-rule="nonzero" d="M476 65v208h8l-9.5 19-9.5-19h8V65h3z"/><path id="Line-2" fill="#EE6B47" fill-rule="nonzero" d="M371 309l19 9.5-19 9.5-.001-8H116v-3h254.999l.001-8z"/><path id="Line-3" fill="#EE6B47" fill-rule="nonzero" d="M100.05 109.903l18.95 9.6-19.05 9.4.042-8.001-78-.41.016-3 78 .41.042-8z"/><text id="right" fill="#999" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold"><tspan x="180" y="375">right</tspan></text><path id="Line-3-Copy-2" fill="#999" fill-rule="nonzero" d="M371 350l19 9.5-19 9.5v-8H21.005v-3H371v-8z"/><path id="Line-3-Copy" fill="#EE6B47" fill-rule="nonzero" d="M119 65l.003 35.749h8l-9.498 19.001-9.502-19h8L116 65h3z"/><path id="Rectangle-1" fill="#E8C48F" fill-opacity=".88" d="M392.629 119v175H118V119h274.629zM382 129H129v155h253V129z"/><text id="Introduction-This-Ec" fill="#5A4739" font-family="OpenSans-Bold, Open Sans" font-size="16" font-weight="bold" opacity=".8"><tspan x="138.946" y="153.8">Introduction</tspan> <tspan x="138.946" y="181.8" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal">This Ecma Standard is based on </tspan> <tspan x="138.946" y="200.8" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal">several originating technologies, </tspan> <tspan x="138.946" y="219.8" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal">the most well known being </tspan> <tspan x="138.946" y="238.8" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal">JavaScript (Netscape) and JScript </tspan> <tspan x="138.946" y="257.8" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal">(Microsoft). The language was </tspan> <tspan x="138.946" y="276.8" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal">invented by Brendan Eich at </tspan></text><text id="top" fill="#999" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold"><tspan x="125" y="96">top</tspan></text></g></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" width="521" height="411" viewBox="0 0 521 411"><defs><style>@import url(https://fonts.googleapis.com/css?family=Open+Sans:bold,italic,bolditalic%7CPT+Mono);@font-face{font-family:&apos;PT Mono&apos;;font-weight:700;font-style:normal;src:local(&apos;PT MonoBold&apos;),url(/font/PTMonoBold.woff2) format(&apos;woff2&apos;),url(/font/PTMonoBold.woff) format(&apos;woff&apos;),url(/font/PTMonoBold.ttf) format(&apos;truetype&apos;)}</style></defs><g id="dom" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><g id="coordinates.svg"><g id="noun_69008_cc" fill="#E8C48E" transform="translate(13 11)"><path id="Shape" d="M490.563 386H10.438C4.676 386 0 381.658 0 376.35V9.65C0 4.342 4.676 0 10.438 0h480.125C496.303 0 501 4.343 501 9.65v366.7c0 5.308-4.697 9.65-10.438 9.65zm-480.4-12.939h478.642V12.94H10.162V373.06z"/><path id="Shape" d="M20.859 54.1c-5.753 0-10.422-1.147-10.422-2.55 0-1.402 4.67-2.55 10.422-2.55H479.4c5.732 0 10.422 1.148 10.422 2.55 0 1.403-4.69 2.55-10.422 2.55H20.86zM33.8 31.627a6.024 6.024 0 11-12.05 0 6.024 6.024 0 1112.05 0zM63.988 31.627a6.024 6.024 0 11-12.05 0 6.024 6.024 0 1112.05 0zM94.177 31.627a6.024 6.024 0 11-12.05 0 6.024 6.024 0 1112.05 0z"/></g><text id="height" fill="#EE6B47" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold"><tspan x="417" y="208">height</tspan></text><text id="bottom" fill="#999" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold"><tspan x="451" y="311">bottom</tspan></text><path id="Line-28" stroke="#EE6B47" stroke-dasharray="3,6" stroke-linecap="square" stroke-width="2" d="M395 293h103"/><path id="Line-30" stroke="#EE6B47" stroke-dasharray="3,6" stroke-linecap="square" stroke-width="2" d="M392 296v74.5"/><path id="Line-30-Copy" stroke="#EE6B47" stroke-dasharray="3,6" stroke-linecap="square" stroke-width="2" d="M119 296v46"/><path id="Line-29" stroke="#EE6B47" stroke-dasharray="3,6" stroke-linecap="square" stroke-width="2" d="M396 120h30"/><text id="x" fill="#EE6B47" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold"><tspan x="62" y="113">x</tspan></text><text id="left" fill="#999" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold"><tspan x="50" y="135">left</tspan></text><text id="y" fill="#EE6B47" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold"><tspan x="125" y="79">y</tspan></text><text id="width" fill="#EE6B47" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold"><tspan x="234" y="339">width</tspan></text><path id="Line" fill="#EE6B47" fill-rule="nonzero" d="M414 118.5V273h8l-9.5 19-9.5-19h8V118.5h3z"/><path id="Line-Copy" fill="#999" fill-rule="nonzero" d="M476 65v208h8l-9.5 19-9.5-19h8V65h3z"/><path id="Line-2" fill="#EE6B47" fill-rule="nonzero" d="M371 309l19 9.5-19 9.5-.001-8H116v-3h254.999l.001-8z"/><path id="Line-3" fill="#EE6B47" fill-rule="nonzero" d="M100.05 109.903l18.95 9.6-19.05 9.4.042-8.001-76.5-.402-1.5-.008.016-3 1.5.008 76.5.402.042-8z"/><text id="right" fill="#999" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold"><tspan x="180" y="375">right</tspan></text><path id="Line-3-Copy-2" fill="#999" fill-rule="nonzero" d="M371 350l19 9.5-19 9.5v-8H21.005v-3H371v-8z"/><path id="Line-3-Copy" fill="#EE6B47" fill-rule="nonzero" d="M119 65v1.5l.003 34.249h8l-9.498 19.001-9.502-19h8L116 66.5V65h3z"/><path id="Rectangle-1" fill="#E8C48F" fill-opacity=".88" d="M392.629 119v175H118V119h274.629zM382 129H129v155h253V129z"/><text id="Introduction-This-Ec" fill="#5A4739" font-family="OpenSans-Bold, Open Sans" font-size="16" font-weight="bold" opacity=".8"><tspan x="138.946" y="153.8">Introduction</tspan> <tspan x="138.946" y="181.8" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal">This Ecma Standard is based on </tspan> <tspan x="138.946" y="200.8" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal">several originating technologies, </tspan> <tspan x="138.946" y="219.8" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal">the most well known being </tspan> <tspan x="138.946" y="238.8" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal">JavaScript (Netscape) and JScript </tspan> <tspan x="138.946" y="257.8" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal">(Microsoft). The language was </tspan> <tspan x="138.946" y="276.8" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal">invented by Brendan Eich at </tspan></text><text id="top" fill="#999" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold"><tspan x="125" y="96">top</tspan></text></g></g></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 4.6 KiB

After

Width:  |  Height:  |  Size: 4.6 KiB

Before After
Before After

2
2-ui/1-document/11-coordinates/document-and-window-coordinates-scrolled.svg
View file

File diff suppressed because one or more lines are too long
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 12 KiB

After

Width:  |  Height:  |  Size: 12 KiB

Before After
Before After

2
2-ui/2-events/02-bubbling-and-capturing/event-order-bubbling.svg
View file

@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="353" height="216" viewBox="0 0 353 216"><defs><style>@import url(https://fonts.googleapis.com/css?family=Open+Sans:bold,italic,bolditalic%7CPT+Mono);@font-face{font-family:&apos;PT Mono&apos;;font-weight:700;font-style:normal;src:local(&apos;PT MonoBold&apos;),url(/font/PTMonoBold.woff2) format(&apos;woff2&apos;),url(/font/PTMonoBold.woff) format(&apos;woff&apos;),url(/font/PTMonoBold.ttf) format(&apos;truetype&apos;)}</style></defs><g id="dom" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><g id="event-order-bubbling.svg"><path id="Rectangle-210" fill="#FFDE99" d="M159.488 140L174 186H60l14.512-46z"/><path id="Rectangle-209" stroke="#CFCE95" stroke-width="18" d="M173.634 81H59.366l-16.09 51h146.447l-16.09-51z"/><path id="Rectangle-208" stroke="#99C0C3" stroke-width="18" d="M193.014 29H39.986l-22.71 72h198.448l-22.71-72z"/><path id="Fill-46" fill="#5A4739" d="M121.5 141v13.816a4.5 4.5 0 01-8.994.212l-.005-.212V141h8.998zm0-31v13h-9v-13h9zm-1.327-88.347l.189.178 17.64 17.64a4.5 4.5 0 01-6.196 6.524l-.168-.16L121.5 35.698V92h-9V35.7l-10.138 10.136a4.5 4.5 0 01-6.523-6.196l.16-.168 17.639-17.64a4.477 4.477 0 013.363-1.3 4.478 4.478 0 013.172 1.122z"/><text id="1" fill="#5A4739" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold"><tspan x="210" y="105">1</tspan></text><text id="2" fill="#5A4739" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold"><tspan x="185" y="136">2</tspan></text><text id="3" fill="#EE6B47" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold"><tspan x="157" y="181">3</tspan></text><text id="Most-deeply-nested-e" fill="#8A704D" font-family="OpenSans-Bold, Open Sans" font-size="14" font-weight="bold"><tspan x="233.48" y="175">Most deeply</tspan> <tspan x="221.306" y="194">nested element</tspan></text><path id="Line-30" stroke="#EE6B47" stroke-dasharray="3,6" stroke-linecap="square" stroke-width="2" d="M179.5 177.5h30"/></g></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" width="353" height="216" viewBox="0 0 353 216"><defs><style>@import url(https://fonts.googleapis.com/css?family=Open+Sans:bold,italic,bolditalic%7CPT+Mono);@font-face{font-family:&apos;PT Mono&apos;;font-weight:700;font-style:normal;src:local(&apos;PT MonoBold&apos;),url(/font/PTMonoBold.woff2) format(&apos;woff2&apos;),url(/font/PTMonoBold.woff) format(&apos;woff&apos;),url(/font/PTMonoBold.ttf) format(&apos;truetype&apos;)}</style></defs><g id="dom" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><g id="event-order-bubbling.svg"><path id="Rectangle-210" fill="#FFDE99" d="M159.488 140L174 186H60l14.512-46z"/><path id="Rectangle-209" stroke="#CFCE95" stroke-width="18" d="M173.634 81H59.366l-16.09 51h146.447l-16.09-51z"/><path id="Rectangle-208" stroke="#99C0C3" stroke-width="18" d="M193.014 29H39.986l-22.71 72h198.448l-22.71-72z"/><path id="Fill-46" fill="#5A4739" d="M121.5 141v13.816a4.5 4.5 0 11-9 0V141h9zm0-31v13h-9v-13h9zM117 20.53a4.471 4.471 0 013.362 1.3l17.64 17.64a4.5 4.5 0 01-6.364 6.364L121.5 35.698V92h-9V35.7l-10.138 10.136a4.5 4.5 0 11-6.363-6.364l17.639-17.64a4.477 4.477 0 013.363-1.3z"/><text id="1" fill="#5A4739" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold"><tspan x="210" y="105">1</tspan></text><text id="2" fill="#5A4739" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold"><tspan x="185" y="136">2</tspan></text><text id="3" fill="#EE6B47" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold"><tspan x="157" y="181">3</tspan></text><text id="Most-deeply-nested-e" fill="#8A704D" font-family="OpenSans-Bold, Open Sans" font-size="14" font-weight="bold"><tspan x="233.48" y="175">Most deeply</tspan> <tspan x="221.306" y="194">nested element</tspan></text><path id="Line-30" stroke="#EE6B47" stroke-dasharray="3,6" stroke-linecap="square" stroke-width="2" d="M179.5 177.5h30"/></g></g></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.9 KiB

After

Width:  |  Height:  |  Size: 1.9 KiB

Before After
Before After

2
2-ui/2-events/03-event-delegation/bagua-bubble.svg
View file

@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="369" height="216" viewBox="0 0 369 216"><defs><style>@import url(https://fonts.googleapis.com/css?family=Open+Sans:bold,italic,bolditalic%7CPT+Mono);@font-face{font-family:&apos;PT Mono&apos;;font-weight:700;font-style:normal;src:local(&apos;PT MonoBold&apos;),url(/font/PTMonoBold.woff2) format(&apos;woff2&apos;),url(/font/PTMonoBold.woff) format(&apos;woff&apos;),url(/font/PTMonoBold.ttf) format(&apos;truetype&apos;)}</style></defs><g id="dom" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><g id="bagua-bubble.svg"><path id="Rectangle-210" fill="#FFDE99" d="M202.488 140L217 186H103l14.512-46z"/><path id="Rectangle-209" stroke="#CFCE95" stroke-width="18" d="M216.634 81H102.366l-16.09 51h146.447l-16.09-51z"/><path id="Rectangle-208" stroke="#99C0C3" stroke-width="18" d="M236.014 29H82.986l-22.71 72h198.448l-22.71-72z"/><path id="Fill-46" fill="#5A4739" d="M164.5 141v13.816a4.5 4.5 0 01-8.994.212l-.005-.212V141h8.998zm0-31v13h-9v-13h9zm-1.327-88.347l.189.178 17.64 17.64a4.5 4.5 0 01-6.196 6.524l-.168-.16L164.5 35.698V92h-9V35.7l-10.138 10.136a4.5 4.5 0 01-6.523-6.196l.16-.168 17.639-17.64a4.477 4.477 0 013.363-1.3 4.478 4.478 0 013.172 1.122z"/><text id="&lt;table&gt;" fill="#99C0C3" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold"><tspan x="9" y="30">&lt;table&gt;</tspan></text><text id="&lt;td&gt;" fill="#CFCE95" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold"><tspan x="36" y="136">&lt;td&gt;</tspan></text><text id="&lt;strong&gt;" fill="#E8C48E" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold"><tspan x="35" y="181">&lt;strong&gt;</tspan></text><text id="event.target" fill="#8A704D" font-family="OpenSans-Bold, Open Sans" font-size="14" font-weight="bold"><tspan x="271.746" y="181">event.target</tspan></text><path id="Line-30" stroke="#EE6B47" stroke-dasharray="3,6" stroke-linecap="square" stroke-width="2" d="M229.5 177.5h30"/></g></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" width="369" height="216" viewBox="0 0 369 216"><defs><style>@import url(https://fonts.googleapis.com/css?family=Open+Sans:bold,italic,bolditalic%7CPT+Mono);@font-face{font-family:&apos;PT Mono&apos;;font-weight:700;font-style:normal;src:local(&apos;PT MonoBold&apos;),url(/font/PTMonoBold.woff2) format(&apos;woff2&apos;),url(/font/PTMonoBold.woff) format(&apos;woff&apos;),url(/font/PTMonoBold.ttf) format(&apos;truetype&apos;)}</style></defs><g id="dom" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><g id="bagua-bubble.svg"><path id="Rectangle-210" fill="#FFDE99" d="M202.488 140L217 186H103l14.512-46z"/><path id="Rectangle-209" stroke="#CFCE95" stroke-width="18" d="M216.634 81H102.366l-16.09 51h146.447l-16.09-51z"/><path id="Rectangle-208" stroke="#99C0C3" stroke-width="18" d="M236.014 29H82.986l-22.71 72h198.448l-22.71-72z"/><path id="Fill-46" fill="#5A4739" d="M164.5 141v13.816a4.5 4.5 0 11-9 0V141h9zm0-31v13h-9v-13h9zM160 20.53a4.471 4.471 0 013.362 1.3l17.64 17.64a4.5 4.5 0 01-6.364 6.364L164.5 35.698V92h-9V35.7l-10.138 10.136a4.5 4.5 0 11-6.363-6.364l17.639-17.64a4.477 4.477 0 013.363-1.3z"/><text id="&lt;table&gt;" fill="#99C0C3" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold"><tspan x="9" y="30">&lt;table&gt;</tspan></text><text id="&lt;td&gt;" fill="#CFCE95" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold"><tspan x="36" y="136">&lt;td&gt;</tspan></text><text id="&lt;strong&gt;" fill="#E8C48E" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold"><tspan x="35" y="181">&lt;strong&gt;</tspan></text><text id="event.target" fill="#8A704D" font-family="OpenSans-Bold, Open Sans" font-size="14" font-weight="bold"><tspan x="271.746" y="181">event.target</tspan></text><path id="Line-30" stroke="#EE6B47" stroke-dasharray="3,6" stroke-linecap="square" stroke-width="2" d="M229.5 177.5h30"/></g></g></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.9 KiB

After

Width:  |  Height:  |  Size: 1.9 KiB

Before After
Before After

2
2-ui/3-event-details/4-mouse-drag-and-drop/2-drag-heroes/solution.view/field.svg
View file

File diff suppressed because one or more lines are too long
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 7.8 KiB

After

Width:  |  Height:  |  Size: 7.8 KiB

Before After
Before After

2
2-ui/3-event-details/5-keyboard-events/german-layout.svg
View file

File diff suppressed because one or more lines are too long
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 39 KiB

After

Width:  |  Height:  |  Size: 39 KiB

Before After
Before After

2
2-ui/4-forms-controls/1-form-elements/form-navigation.svg
View file

File diff suppressed because one or more lines are too long
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 4.2 KiB

After

Width:  |  Height:  |  Size: 4.9 KiB

Before After
Before After

2
2-ui/99-ui-misc/02-selection-range/range-example-p-2-b-3-range.svg
View file

File diff suppressed because one or more lines are too long
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 19 KiB

After

Width:  |  Height:  |  Size: 19 KiB

Before After
Before After

2
2-ui/99-ui-misc/02-selection-range/selection-firefox.svg
View file

File diff suppressed because one or more lines are too long
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 106 KiB

After

Width:  |  Height:  |  Size: 106 KiB

Before After
Before After

2
2-ui/99-ui-misc/03-event-loop/eventLoop-full.svg
View file

File diff suppressed because one or more lines are too long
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 8.1 KiB

After

Width:  |  Height:  |  Size: 8.2 KiB

Before After
Before After

2
2-ui/99-ui-misc/03-event-loop/eventLoop.svg
View file

@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="479" height="279" viewBox="0 0 479 279"><defs><style>@import url(https://fonts.googleapis.com/css?family=Open+Sans:bold,italic,bolditalic%7CPT+Mono);@font-face{font-family:&apos;PT Mono&apos;;font-weight:700;font-style:normal;src:local(&apos;PT MonoBold&apos;),url(/font/PTMonoBold.woff2) format(&apos;woff2&apos;),url(/font/PTMonoBold.woff) format(&apos;woff&apos;),url(/font/PTMonoBold.ttf) format(&apos;truetype&apos;)}</style></defs><g id="promise" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><g id="eventLoop.svg"><path id="Rectangle-1-Copy-5" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M218 173h108v28H218z"/><text id="..." fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="258.9" y="189">...</tspan></text><path id="Rectangle-1-Copy-6" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M218 90h108v28H218z"/><path id="Rectangle-1-Copy-8" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M218 117h108v28H218z"/><text id="mousemove" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="233.7" y="136">mousemove</tspan></text><path id="Rectangle-1-Copy-9" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M218 145h108v28H218z"/><text id="script" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="246.8" y="109">script</tspan></text><text id="event-loop" fill="#000" font-family="OpenSans-Regular, Open Sans" font-size="24" font-weight="normal"><tspan x="69.662" y="134">event</tspan> <tspan x="75.615" y="167">loop</tspan></text><text id="macrotask-queue" fill="#9B9B9B" font-family="OpenSans-Regular, Open Sans" font-size="24" font-weight="normal"><tspan x="345.111" y="136">macrotask</tspan> <tspan x="367.951" y="169">queue</tspan></text><path id="Path" fill="#EE6B47" fill-rule="nonzero" d="M192 40c22.734 0 44.327 7.535 61.907 21.191l.143.122 8.96 8.421-4.583-14.609 3.817-1.197 7.933 25.287-25.73-6.351.959-3.884 14.865 3.669-8.892-8.356-.619-.476C234.003 51.038 213.54 44 192 44c-31.059 0-59.667 14.695-77.864 39.143l-3.208-2.388C129.87 55.303 159.664 40 192 40z"/><path id="Path-Copy-2" fill="#EE6B47" fill-rule="nonzero" d="M269.882 208.148l2.823 2.834c-.37.368-.724.723-1.095 1.096l-6.044 6.136c-7.85 7.915-12.419 11.984-18.455 16.046l-1.104.732c-15.185 9.934-34.01 15.688-51.594 15.688-25.515 0-47.653-6.986-64.666-20.124l-.089-.069-8.934-8.66 4.36 14.68-3.835 1.139-7.544-25.407 25.63 6.747-1.019 3.868-14.808-3.898 8.772 8.502.57.435c16.198 12.252 37.233 18.787 61.563 18.787 16.796 0 34.862-5.522 49.404-15.035 6.435-4.21 10.964-8.214 19.407-16.751l4.773-4.853 1.885-1.893z"/><text id="setTimeout" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="230" y="164">setTimeout</tspan></text></g></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" width="479" height="279" viewBox="0 0 479 279"><defs><style>@import url(https://fonts.googleapis.com/css?family=Open+Sans:bold,italic,bolditalic%7CPT+Mono);@font-face{font-family:&apos;PT Mono&apos;;font-weight:700;font-style:normal;src:local(&apos;PT MonoBold&apos;),url(/font/PTMonoBold.woff2) format(&apos;woff2&apos;),url(/font/PTMonoBold.woff) format(&apos;woff&apos;),url(/font/PTMonoBold.ttf) format(&apos;truetype&apos;)}</style></defs><g id="promise" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><g id="eventLoop.svg"><path id="Rectangle-1-Copy-5" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M218 173h108v28H218z"/><text id="..." fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="258.9" y="189">...</tspan></text><path id="Rectangle-1-Copy-6" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M218 90h108v28H218z"/><path id="Rectangle-1-Copy-8" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M218 117h108v28H218z"/><text id="mousemove" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="233.7" y="136">mousemove</tspan></text><path id="Rectangle-1-Copy-9" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M218 145h108v28H218z"/><text id="script" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="246.8" y="109">script</tspan></text><text id="event-loop" fill="#000" font-family="OpenSans-Regular, Open Sans" font-size="24" font-weight="normal"><tspan x="69.662" y="134">event</tspan> <tspan x="75.615" y="167">loop</tspan></text><text id="macrotask-queue" fill="#9B9B9B" font-family="OpenSans-Regular, Open Sans" font-size="24" font-weight="normal"><tspan x="345.111" y="136">macrotask</tspan> <tspan x="367.951" y="169">queue</tspan></text><path id="Path" fill="#EE6B47" fill-rule="nonzero" d="M192 40c22.467 0 43.818 7.359 61.285 20.712l.622.479.143.122 8.961 8.422-4.584-14.61 3.817-1.197 6.869 21.895 1.064 3.392-3.452-.852-22.278-5.5.959-3.883 14.864 3.669-8.886-8.352-.55-.424c-16.564-12.656-36.757-19.698-58.036-19.87L192 44c-30.748 0-59.095 14.403-77.315 38.412l-.549.73-3.208-2.387C129.87 55.303 159.664 40 192 40z"/><path id="Path-Copy-2" fill="#EE6B47" fill-rule="nonzero" d="M269.882 208.148l2.823 2.834-.366.365a533.245 533.245 0 00-3.982 4.033l-.333.34c-9.922 10.12-14.79 14.544-22.017 19.272-15.185 9.934-34.01 15.688-51.594 15.688-25.222 0-47.144-6.827-64.077-19.673l-.589-.45-.089-.07-.08-.078-8.854-8.581 4.36 14.68-3.835 1.138-6.532-21.998-1.012-3.409 3.439.906 22.19 5.841-1.018 3.868-14.808-3.898 8.766 8.497.488.374c16.02 12.15 36.782 18.698 60.792 18.85l.859.003c16.796 0 34.862-5.522 49.404-15.035 6.911-4.521 11.624-8.806 21.35-18.725l.334-.34c2.06-2.101 3.135-3.19 4.381-4.432z"/><text id="setTimeout" fill="#8A704D" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal"><tspan x="230" y="164">setTimeout</tspan></text></g></g></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.8 KiB

After

Width:  |  Height:  |  Size: 2.9 KiB

Before After
Before After

2
5-network/05-fetch-crossorigin/cors-gmail-messages.svg
View file

File diff suppressed because one or more lines are too long
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 60 KiB

After

Width:  |  Height:  |  Size: 60 KiB

Before After
Before After

2
5-network/10-long-polling/long-polling.svg
View file

@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="521" height="320" viewBox="0 0 521 320"><defs><style>@import url(https://fonts.googleapis.com/css?family=Open+Sans:bold,italic,bolditalic%7CPT+Mono);@font-face{font-family:&apos;PT Mono&apos;;font-weight:700;font-style:normal;src:local(&apos;PT MonoBold&apos;),url(/font/PTMonoBold.woff2) format(&apos;woff2&apos;),url(/font/PTMonoBold.woff) format(&apos;woff&apos;),url(/font/PTMonoBold.ttf) format(&apos;truetype&apos;)}</style></defs><g id="network" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><g id="long-polling.svg"><text id="Browser" fill="#000" font-family="OpenSans-Regular, Open Sans" font-size="16" font-weight="normal"><tspan x="27" y="74">Browser</tspan></text><text id="Server" fill="#000" font-family="OpenSans-Regular, Open Sans" font-size="16" font-weight="normal"><tspan x="31" y="226">Server</tspan></text><path id="Line" fill="#000" fill-rule="nonzero" d="M450.81 75.82l9.21 5.18-9.21 5.18-.49-.87 6.771-3.81H66.5v-1h390.591l-6.772-3.81.49-.87zM450.81 200.32l9.21 5.18-9.21 5.18-.49-.87 6.769-3.81H65.5v-1h391.593l-6.774-3.81.49-.87z"/><text id="request" fill="#8A704D" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold" transform="rotate(76 113.291 143.266)"><tspan x="83.891" y="146.266">request</tspan></text><text id="connection-hangs" fill="#8A704D" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal"><tspan x="126" y="227">connection</tspan> <tspan x="142.519" y="245">hangs</tspan></text><text id="connection-breaks-en" fill="#8A704D" font-family="OpenSans-Regular, Open Sans" font-size="12" font-weight="normal"><tspan x="186.21" y="264">connection breaks</tspan> <tspan x="196.599" y="282">end of request</tspan></text><path id="Line-3" fill="#EE6B47" fill-rule="nonzero" d="M90.233 80.79l27.406 111.874 5.829-1.428L120 206.5l-10.13-11.932 5.827-1.429L88.291 81.267l1.942-.476z"/><text id="data" fill="#8A704D" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold" transform="rotate(-76 206.38 143.266)"><tspan x="189.58" y="146.266">data</tspan></text><path id="Line-2" fill="#EE6B47" fill-rule="nonzero" d="M233.226 82l3.107 15.341-5.793-1.565-29.835 110.45-1.931-.521 29.834-110.45-5.79-1.565L233.225 82z"/><path id="Line-2-Copy" fill="#EE6B47" fill-rule="nonzero" d="M377.226 82l3.107 15.341-5.793-1.565-29.835 110.45-1.931-.521 29.834-110.45-5.79-1.565L377.225 82z"/><text id="request-copy" fill="#8A704D" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold" transform="rotate(76 260.291 143.266)"><tspan x="230.891" y="146.266">request</tspan></text><text id="connection-hangs-copy" fill="#8A704D" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal"><tspan x="270" y="227">connection</tspan> <tspan x="286.519" y="245">hangs</tspan></text><path id="Line-3-Copy-3" fill="#EE6B47" fill-rule="nonzero" d="M237.233 80.79l27.406 111.874 5.829-1.428L267 206.5l-10.13-11.932 5.827-1.429-27.406-111.872 1.942-.476z"/><text id="request-copy-2" fill="#8A704D" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold" transform="rotate(76 404.291 143.266)"><tspan x="374.891" y="146.266">request</tspan></text><path id="Line-3-Copy-4" fill="#EE6B47" fill-rule="nonzero" d="M381.233 80.79l27.406 111.874 5.829-1.428L411 206.5l-10.13-11.932 5.827-1.429-27.406-111.872 1.942-.476z"/><text id="data-copy" fill="#8A704D" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold" transform="rotate(-76 350.38 143.266)"><tspan x="333.58" y="146.266">data</tspan></text><path id="Line" stroke="#979797" stroke-dasharray="3,3" stroke-linecap="square" d="M235 40.75v201"/><text id="connection-breaks-en-copy" fill="#8A704D" font-family="OpenSans-Regular, Open Sans" font-size="12" font-weight="normal"><tspan x="330.21" y="264">connection breaks</tspan> <tspan x="340.599" y="282">end of request</tspan></text><path id="Line-Copy" stroke="#979797" stroke-dasharray="3,3" stroke-linecap="square" d="M379 40.75v201"/></g></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" width="521" height="320" viewBox="0 0 521 320"><defs><style>@import url(https://fonts.googleapis.com/css?family=Open+Sans:bold,italic,bolditalic%7CPT+Mono);@font-face{font-family:&apos;PT Mono&apos;;font-weight:700;font-style:normal;src:local(&apos;PT MonoBold&apos;),url(/font/PTMonoBold.woff2) format(&apos;woff2&apos;),url(/font/PTMonoBold.woff) format(&apos;woff&apos;),url(/font/PTMonoBold.ttf) format(&apos;truetype&apos;)}</style></defs><g id="network" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><g id="long-polling.svg"><text id="Browser" fill="#000" font-family="OpenSans-Regular, Open Sans" font-size="16" font-weight="normal"><tspan x="27" y="74">Browser</tspan></text><text id="Server" fill="#000" font-family="OpenSans-Regular, Open Sans" font-size="16" font-weight="normal"><tspan x="31" y="226">Server</tspan></text><path id="Line" fill="#000" fill-rule="nonzero" d="M450.81 75.82l.435.244 8 4.5.775.436-.775.436-8 4.5-.436.245-.49-.872.436-.245 6.336-3.564H66.5v-1h390.591l-6.336-3.564-.436-.245.49-.872zM450.81 200.32l.435.244 8 4.5.775.436-.775.436-8 4.5-.436.245-.49-.872.436-.245L457.09 206H65.5v-1h391.591l-6.336-3.564-.436-.245.49-.872z"/><text id="request" fill="#8A704D" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold" transform="rotate(76 113.291 143.266)"><tspan x="83.891" y="146.266">request</tspan></text><text id="connection-hangs" fill="#8A704D" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal"><tspan x="126" y="227">connection</tspan> <tspan x="142.519" y="245">hangs</tspan></text><text id="connection-breaks-en" fill="#8A704D" font-family="OpenSans-Regular, Open Sans" font-size="12" font-weight="normal"><tspan x="186.21" y="264">connection breaks</tspan> <tspan x="196.599" y="282">end of request</tspan></text><path id="Line-3" fill="#EE6B47" fill-rule="nonzero" d="M90.233 80.79l.238.972 27.169 110.901 5.828-1.427L120 206.5l-10.13-11.932 5.827-1.429L88.529 82.238l-.238-.971 1.942-.476z"/><text id="data" fill="#8A704D" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold" transform="rotate(-76 206.38 143.266)"><tspan x="189.58" y="146.266">data</tspan></text><path id="Line-2" fill="#EE6B47" fill-rule="nonzero" d="M233.226 82l3.107 15.341-5.794-1.565-29.574 109.485-.26.965-1.931-.521.26-.966L228.61 95.255l-5.792-1.565L233.226 82z"/><path id="Line-2-Copy" fill="#EE6B47" fill-rule="nonzero" d="M377.226 82l3.107 15.341-5.794-1.565-29.574 109.485-.26.965-1.931-.521.26-.966L372.61 95.255l-5.792-1.565L377.226 82z"/><text id="request-copy" fill="#8A704D" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold" transform="rotate(76 260.291 143.266)"><tspan x="230.891" y="146.266">request</tspan></text><text id="connection-hangs-copy" fill="#8A704D" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal"><tspan x="270" y="227">connection</tspan> <tspan x="286.519" y="245">hangs</tspan></text><path id="Line-3-Copy-3" fill="#EE6B47" fill-rule="nonzero" d="M237.233 80.79l.238.972 27.169 110.901 5.828-1.427L267 206.5l-10.13-11.932 5.827-1.429-27.168-110.901-.238-.971 1.942-.476z"/><text id="request-copy-2" fill="#8A704D" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold" transform="rotate(76 404.291 143.266)"><tspan x="374.891" y="146.266">request</tspan></text><path id="Line-3-Copy-4" fill="#EE6B47" fill-rule="nonzero" d="M381.233 80.79l.238.972 27.169 110.901 5.828-1.427L411 206.5l-10.13-11.932 5.827-1.429-27.168-110.901-.238-.971 1.942-.476z"/><text id="data-copy" fill="#8A704D" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold" transform="rotate(-76 350.38 143.266)"><tspan x="333.58" y="146.266">data</tspan></text><path id="Line" stroke="#979797" stroke-dasharray="3,3" stroke-linecap="square" d="M235 40.75v201"/><text id="connection-breaks-en-copy" fill="#8A704D" font-family="OpenSans-Regular, Open Sans" font-size="12" font-weight="normal"><tspan x="330.21" y="264">connection breaks</tspan> <tspan x="340.599" y="282">end of request</tspan></text><path id="Line-Copy" stroke="#979797" stroke-dasharray="3,3" stroke-linecap="square" d="M379 40.75v201"/></g></g></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3.9 KiB

After

Width:  |  Height:  |  Size: 4.1 KiB

Before After
Before After

2
6-data-storage/01-cookie/cookie-third-party-2.svg
View file

@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="668" height="192" viewBox="0 0 668 192"><defs><style>@import url(https://fonts.googleapis.com/css?family=Open+Sans:bold,italic,bolditalic%7CPT+Mono);@font-face{font-family:&apos;PT Mono&apos;;font-weight:700;font-style:normal;src:local(&apos;PT MonoBold&apos;),url(/font/PTMonoBold.woff2) format(&apos;woff2&apos;),url(/font/PTMonoBold.woff) format(&apos;woff&apos;),url(/font/PTMonoBold.ttf) format(&apos;truetype&apos;)}</style></defs><g id="data-storage" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><g id="cookie-third-party-2.svg"><path id="Rectangle-1" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M38 48h282v99H38z"/><text id="&lt;img-src=&quot;https://ad" fill="#8A704D" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal"><tspan x="42" y="70">&lt;img src=&quot;https://ads.com/banner.png&quot;&gt;</tspan></text><text id="site.com" fill="#8A704D" font-family="OpenSans-Bold, Open Sans" font-size="14" font-weight="bold"><tspan x="149" y="36">site.com</tspan></text><path id="Rectangle-1-Copy" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M505 48h140v99H505z"/><text id="ads.com" fill="#8A704D" font-family="OpenSans-Bold, Open Sans" font-size="14" font-weight="bold"><tspan x="543" y="36">ads.com</tspan></text><path id="Line" fill="#EE6B47" fill-rule="nonzero" d="M321.643 67.375l164.118 22.252.806-5.945L499.5 92.5l-14.814 5.055.806-5.946-164.117-22.252.268-1.982z"/><text id="GET-/banner.png" fill="#8A704D" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal" transform="rotate(7 416.568 68.382)"><tspan x="361.068" y="73.882">GET /banner.png</tspan></text><text id="cookie:-id=123" fill="#8A704D" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal" transform="rotate(7 410.08 93.2)"><tspan x="363.08" y="98.699">cookie: id=123</tspan></text></g></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" width="668" height="192" viewBox="0 0 668 192"><defs><style>@import url(https://fonts.googleapis.com/css?family=Open+Sans:bold,italic,bolditalic%7CPT+Mono);@font-face{font-family:&apos;PT Mono&apos;;font-weight:700;font-style:normal;src:local(&apos;PT MonoBold&apos;),url(/font/PTMonoBold.woff2) format(&apos;woff2&apos;),url(/font/PTMonoBold.woff) format(&apos;woff&apos;),url(/font/PTMonoBold.ttf) format(&apos;truetype&apos;)}</style></defs><g id="data-storage" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><g id="cookie-third-party-2.svg"><path id="Rectangle-1" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M38 48h282v99H38z"/><text id="&lt;img-src=&quot;https://ad" fill="#8A704D" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal"><tspan x="42" y="70">&lt;img src=&quot;https://ads.com/banner.png&quot;&gt;</tspan></text><text id="site.com" fill="#8A704D" font-family="OpenSans-Bold, Open Sans" font-size="14" font-weight="bold"><tspan x="149" y="36">site.com</tspan></text><path id="Rectangle-1-Copy" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M505 48h140v99H505z"/><text id="ads.com" fill="#8A704D" font-family="OpenSans-Bold, Open Sans" font-size="14" font-weight="bold"><tspan x="543" y="36">ads.com</tspan></text><path id="Line" fill="#EE6B47" fill-rule="nonzero" d="M321.643 67.375l.991.134 163.127 22.119.806-5.946L499.5 92.5l-14.814 5.055.806-5.945-163.126-22.12-.991-.133.268-1.982z"/><text id="GET-/banner.png" fill="#8A704D" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal" transform="rotate(7 416.568 68.382)"><tspan x="361.068" y="73.882">GET /banner.png</tspan></text><text id="cookie:-id=123" fill="#8A704D" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal" transform="rotate(7 410.08 93.2)"><tspan x="363.08" y="98.699">cookie: id=123</tspan></text></g></g></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.9 KiB

After

Width:  |  Height:  |  Size: 1.9 KiB

Before After
Before After

2
6-data-storage/01-cookie/cookie-third-party-3.svg
View file

@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="668" height="192" viewBox="0 0 668 192"><defs><style>@import url(https://fonts.googleapis.com/css?family=Open+Sans:bold,italic,bolditalic%7CPT+Mono);@font-face{font-family:&apos;PT Mono&apos;;font-weight:700;font-style:normal;src:local(&apos;PT MonoBold&apos;),url(/font/PTMonoBold.woff2) format(&apos;woff2&apos;),url(/font/PTMonoBold.woff) format(&apos;woff&apos;),url(/font/PTMonoBold.ttf) format(&apos;truetype&apos;)}</style></defs><g id="data-storage" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><g id="cookie-third-party-3.svg"><path id="Rectangle-1" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M38 48h282v99H38z"/><text id="&lt;img-src=&quot;https://ad" fill="#8A704D" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal"><tspan x="42" y="70">&lt;img src=&quot;https://ads.com/banner.png&quot;&gt;</tspan></text><text id="other.com" fill="#8A704D" font-family="OpenSans-Bold, Open Sans" font-size="14" font-weight="bold"><tspan x="144" y="36">other.com</tspan></text><path id="Rectangle-1-Copy" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M505 48h140v99H505z"/><text id="ads.com" fill="#8A704D" font-family="OpenSans-Bold, Open Sans" font-size="14" font-weight="bold"><tspan x="543" y="36">ads.com</tspan></text><path id="Line" fill="#EE6B47" fill-rule="nonzero" d="M321.643 67.375l164.118 22.252.806-5.945L499.5 92.5l-14.814 5.055.806-5.946-164.117-22.252.268-1.982z"/><text id="GET-/banner.png" fill="#8A704D" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal" transform="rotate(7 416.568 68.382)"><tspan x="361.068" y="73.882">GET /banner.png</tspan></text><text id="cookie:-id=123" fill="#8A704D" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal" transform="rotate(7 410.08 93.2)"><tspan x="363.08" y="98.699">cookie: id=123</tspan></text><ellipse id="Oval-6" cx="176" cy="31.5" stroke="#EE6B47" stroke-opacity=".573" stroke-width="2" rx="48" ry="13.5"/></g></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" width="668" height="192" viewBox="0 0 668 192"><defs><style>@import url(https://fonts.googleapis.com/css?family=Open+Sans:bold,italic,bolditalic%7CPT+Mono);@font-face{font-family:&apos;PT Mono&apos;;font-weight:700;font-style:normal;src:local(&apos;PT MonoBold&apos;),url(/font/PTMonoBold.woff2) format(&apos;woff2&apos;),url(/font/PTMonoBold.woff) format(&apos;woff&apos;),url(/font/PTMonoBold.ttf) format(&apos;truetype&apos;)}</style></defs><g id="data-storage" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><g id="cookie-third-party-3.svg"><path id="Rectangle-1" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M38 48h282v99H38z"/><text id="&lt;img-src=&quot;https://ad" fill="#8A704D" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal"><tspan x="42" y="70">&lt;img src=&quot;https://ads.com/banner.png&quot;&gt;</tspan></text><text id="other.com" fill="#8A704D" font-family="OpenSans-Bold, Open Sans" font-size="14" font-weight="bold"><tspan x="144" y="36">other.com</tspan></text><path id="Rectangle-1-Copy" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M505 48h140v99H505z"/><text id="ads.com" fill="#8A704D" font-family="OpenSans-Bold, Open Sans" font-size="14" font-weight="bold"><tspan x="543" y="36">ads.com</tspan></text><path id="Line" fill="#EE6B47" fill-rule="nonzero" d="M321.643 67.375l.991.134 163.127 22.119.806-5.946L499.5 92.5l-14.814 5.055.806-5.945-163.126-22.12-.991-.133.268-1.982z"/><text id="GET-/banner.png" fill="#8A704D" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal" transform="rotate(7 416.568 68.382)"><tspan x="361.068" y="73.882">GET /banner.png</tspan></text><text id="cookie:-id=123" fill="#8A704D" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal" transform="rotate(7 410.08 93.2)"><tspan x="363.08" y="98.699">cookie: id=123</tspan></text><ellipse id="Oval-6" cx="176" cy="31.5" stroke="#EE6B47" stroke-opacity=".573" stroke-width="2" rx="48" ry="13.5"/></g></g></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2 KiB

After

Width:  |  Height:  |  Size: 2 KiB

Before After
Before After

2
6-data-storage/01-cookie/cookie-third-party.svg
View file

@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="668" height="192" viewBox="0 0 668 192"><defs><style>@import url(https://fonts.googleapis.com/css?family=Open+Sans:bold,italic,bolditalic%7CPT+Mono);@font-face{font-family:&apos;PT Mono&apos;;font-weight:700;font-style:normal;src:local(&apos;PT MonoBold&apos;),url(/font/PTMonoBold.woff2) format(&apos;woff2&apos;),url(/font/PTMonoBold.woff) format(&apos;woff&apos;),url(/font/PTMonoBold.ttf) format(&apos;truetype&apos;)}</style></defs><g id="data-storage" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><g id="cookie-third-party.svg"><path id="Rectangle-1" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M38 48h282v99H38z"/><text id="&lt;img-src=&quot;https://ad" fill="#8A704D" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal"><tspan x="42" y="70">&lt;img src=&quot;https://ads.com/banner.png&quot;&gt;</tspan></text><text id="site.com" fill="#8A704D" font-family="OpenSans-Bold, Open Sans" font-size="14" font-weight="bold"><tspan x="149" y="36">site.com</tspan></text><path id="Rectangle-1-Copy" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M505 48h140v99H505z"/><text id="ads.com" fill="#8A704D" font-family="OpenSans-Bold, Open Sans" font-size="14" font-weight="bold"><tspan x="543" y="36">ads.com</tspan></text><path id="Line" fill="#EE6B47" fill-rule="nonzero" d="M321.643 64.375l164.118 22.252.806-5.945L499.5 89.5l-14.814 5.055.806-5.946-164.117-22.252.268-1.982z"/><path id="Line-Copy" fill="#EE6B47" fill-rule="nonzero" d="M500.366 105.882l.252 1.984-164.104 20.86.757 5.953L322.5 129.5l13.006-8.71.755 5.952 164.105-20.86z"/><text id="GET-/banner.png" fill="#8A704D" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal" transform="rotate(7 416.568 65.382)"><tspan x="361.068" y="70.882">GET /banner.png</tspan></text><text id="Set-Cookie:-id=123" fill="#8A704D" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal" transform="rotate(-7 413.469 128.991)"><tspan x="352.969" y="134.491">Set-Cookie: id=123</tspan></text></g></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" width="668" height="192" viewBox="0 0 668 192"><defs><style>@import url(https://fonts.googleapis.com/css?family=Open+Sans:bold,italic,bolditalic%7CPT+Mono);@font-face{font-family:&apos;PT Mono&apos;;font-weight:700;font-style:normal;src:local(&apos;PT MonoBold&apos;),url(/font/PTMonoBold.woff2) format(&apos;woff2&apos;),url(/font/PTMonoBold.woff) format(&apos;woff&apos;),url(/font/PTMonoBold.ttf) format(&apos;truetype&apos;)}</style></defs><g id="data-storage" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><g id="cookie-third-party.svg"><path id="Rectangle-1" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M38 48h282v99H38z"/><text id="&lt;img-src=&quot;https://ad" fill="#8A704D" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal"><tspan x="42" y="70">&lt;img src=&quot;https://ads.com/banner.png&quot;&gt;</tspan></text><text id="site.com" fill="#8A704D" font-family="OpenSans-Bold, Open Sans" font-size="14" font-weight="bold"><tspan x="149" y="36">site.com</tspan></text><path id="Rectangle-1-Copy" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M505 48h140v99H505z"/><text id="ads.com" fill="#8A704D" font-family="OpenSans-Bold, Open Sans" font-size="14" font-weight="bold"><tspan x="543" y="36">ads.com</tspan></text><path id="Line" fill="#EE6B47" fill-rule="nonzero" d="M321.643 64.375l.991.134 163.127 22.119.806-5.946L499.5 89.5l-14.814 5.055.806-5.945-163.126-22.12-.991-.133.268-1.982z"/><path id="Line-Copy" fill="#EE6B47" fill-rule="nonzero" d="M500.366 105.882l.252 1.984-.992.126-163.112 20.734.757 5.953L322.5 129.5l13.006-8.71.755 5.952 163.113-20.734.992-.126z"/><text id="GET-/banner.png" fill="#8A704D" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal" transform="rotate(7 416.568 65.382)"><tspan x="361.068" y="70.882">GET /banner.png</tspan></text><text id="Set-Cookie:-id=123" fill="#8A704D" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal" transform="rotate(-7 413.469 128.991)"><tspan x="352.969" y="134.491">Set-Cookie: id=123</tspan></text></g></g></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.1 KiB

After

Width:  |  Height:  |  Size: 2.1 KiB

Before After
Before After

2
6-data-storage/01-cookie/cookie-xsrf.svg
View file

@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="668" height="166" viewBox="0 0 668 166"><defs><style>@import url(https://fonts.googleapis.com/css?family=Open+Sans:bold,italic,bolditalic%7CPT+Mono);@font-face{font-family:&apos;PT Mono&apos;;font-weight:700;font-style:normal;src:local(&apos;PT MonoBold&apos;),url(/font/PTMonoBold.woff2) format(&apos;woff2&apos;),url(/font/PTMonoBold.woff) format(&apos;woff&apos;),url(/font/PTMonoBold.ttf) format(&apos;truetype&apos;)}</style></defs><g id="data-storage" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><g id="cookie-xsrf.svg"><path id="Rectangle-1" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M38 48h282v88H38z"/><text id="&lt;form-action=&quot;https:" fill="#8A704D" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal"><tspan x="48" y="69">&lt;form action=&quot;https://bank.com/pay&quot;&gt;</tspan> <tspan x="48" y="88"> ....</tspan> <tspan x="48" y="107">&lt;/form&gt;</tspan></text><text id="evil.com" fill="#8A704D" font-family="OpenSans-Bold, Open Sans" font-size="14" font-weight="bold"><tspan x="149" y="36">evil.com</tspan></text><path id="Rectangle-1-Copy" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M505 48h140v88H505z"/><text id="got-the-cookie?-okay" fill="#8A704D" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal"><tspan x="526.469" y="108">got the cookie?</tspan> <tspan x="558.308" y="127">okay!</tspan></text><text id="bank.com" fill="#8A704D" font-family="OpenSans-Bold, Open Sans" font-size="14" font-weight="bold"><tspan x="543" y="36">bank.com</tspan></text><path id="Line" fill="#EE6B47" fill-rule="nonzero" d="M321.643 67.375l164.118 22.252.806-5.945L499.5 92.5l-14.814 5.055.806-5.946-164.117-22.252.268-1.982z"/><text id="POST-/pay" fill="#8A704D" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal" transform="rotate(7 409.576 67.26)"><tspan x="376.076" y="72.76">POST /pay</tspan></text><text id="cookie:-user=John" fill="#8A704D" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal" transform="rotate(7 407.076 90.26)"><tspan x="349.076" y="95.76">cookie: user=John</tspan></text></g></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" width="668" height="166" viewBox="0 0 668 166"><defs><style>@import url(https://fonts.googleapis.com/css?family=Open+Sans:bold,italic,bolditalic%7CPT+Mono);@font-face{font-family:&apos;PT Mono&apos;;font-weight:700;font-style:normal;src:local(&apos;PT MonoBold&apos;),url(/font/PTMonoBold.woff2) format(&apos;woff2&apos;),url(/font/PTMonoBold.woff) format(&apos;woff&apos;),url(/font/PTMonoBold.ttf) format(&apos;truetype&apos;)}</style></defs><g id="data-storage" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><g id="cookie-xsrf.svg"><path id="Rectangle-1" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M38 48h282v88H38z"/><text id="&lt;form-action=&quot;https:" fill="#8A704D" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal"><tspan x="48" y="69">&lt;form action=&quot;https://bank.com/pay&quot;&gt;</tspan> <tspan x="48" y="88"> ....</tspan> <tspan x="48" y="107">&lt;/form&gt;</tspan></text><text id="evil.com" fill="#8A704D" font-family="OpenSans-Bold, Open Sans" font-size="14" font-weight="bold"><tspan x="149" y="36">evil.com</tspan></text><path id="Rectangle-1-Copy" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M505 48h140v88H505z"/><text id="got-the-cookie?-okay" fill="#8A704D" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal"><tspan x="526.469" y="108">got the cookie?</tspan> <tspan x="558.308" y="127">okay!</tspan></text><text id="bank.com" fill="#8A704D" font-family="OpenSans-Bold, Open Sans" font-size="14" font-weight="bold"><tspan x="543" y="36">bank.com</tspan></text><path id="Line" fill="#EE6B47" fill-rule="nonzero" d="M321.643 67.375l.991.134 163.127 22.119.806-5.946L499.5 92.5l-14.814 5.055.806-5.945-163.126-22.12-.991-.133.268-1.982z"/><text id="POST-/pay" fill="#8A704D" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal" transform="rotate(7 409.576 67.26)"><tspan x="376.076" y="72.76">POST /pay</tspan></text><text id="cookie:-user=John" fill="#8A704D" font-family="OpenSans-Regular, Open Sans" font-size="14" font-weight="normal" transform="rotate(7 407.076 90.26)"><tspan x="349.076" y="95.76">cookie: user=John</tspan></text></g></g></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.2 KiB

After

Width:  |  Height:  |  Size: 2.2 KiB

Before After
Before After

2
6-data-storage/03-indexeddb/indexeddb-index.svg
View file

File diff suppressed because one or more lines are too long
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 5.1 KiB

After

Width:  |  Height:  |  Size: 6.2 KiB

Before After
Before After

BIN
figures.sketch
View file

Binary file not shown.