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

minify pictures

Browse source
This commit is contained in:
Ilya Kantor 2015-01-28 14:16:51 +03:00
parent 6eacea0d4f
commit 6c4af3d588
61 changed files with 28 additions and 3075 deletions
Download patch file Download diff file Expand all files Collapse all files

132
1-js/1-getting-started/1-intro/limitations.svg
View file

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

Before

Width:  |  Height:  |  Size: 42 KiB

After

Width:  |  Height:  |  Size: 15 KiB

Before After
Before After

BIN
1-js/1-getting-started/4-devtools/chrome@2x.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 56 KiB

After

Width:  |  Height:  |  Size: 16 KiB

Before After
Before After

BIN
1-js/1-getting-started/4-devtools/firebug-gray.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 23 KiB

After

Width:  |  Height:  |  Size: 8.7 KiB

Before After
Before After

BIN
1-js/1-getting-started/4-devtools/firefox@2x.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 82 KiB

After

Width:  |  Height:  |  Size: 32 KiB

Before After
Before After

BIN
1-js/1-getting-started/4-devtools/firefox_console_down@2x.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3.7 KiB

After

Width:  |  Height:  |  Size: 544 B

Before After
Before After

BIN
1-js/1-getting-started/4-devtools/firefox_console_enable@2x.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 83 KiB

After

Width:  |  Height:  |  Size: 34 KiB

Before After
Before After

BIN
1-js/1-getting-started/4-devtools/safari.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 69 KiB

After

Width:  |  Height:  |  Size: 24 KiB

Before After
Before After

BIN
1-js/2-first-steps/17-function-basics/style.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 12 KiB

After

Width:  |  Height:  |  Size: 4.9 KiB

Before After
Before After

28
1-js/2-first-steps/5-variables/variable-brown.svg
View file

@ -1,27 +1 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="148px" height="128px" viewBox="0 0 148 128" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
<!-- Generator: Sketch 3.2.2 (9983) - http://www.bohemiancoding.com/sketch -->
<title>noun_1211_cc + Message</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="combined-brown" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
<g id="variable" sketch:type="MSArtboardGroup" transform="translate(-161.000000, -71.000000)">
<g id="noun_1211_cc-+-Message" sketch:type="MSLayerGroup" transform="translate(161.000000, 71.000000)">
<g id="noun_1211_cc">
<path d="M17,37.1960457 L129.557785,37.1960457 L129.557785,80.1456641 C129.557785,80.5185728 129.479295,81.0083855 129.279367,81.4404861 C129.07944,81.8725868 112.704625,117 112.704625,117 L112.704625,62.6396695 L129.559266,37.1960457 L148,9 L35.4407339,9 L17,37.1960457 L17,37.1960457 Z" id="Shape" fill="#D1C4B1" sketch:type="MSShapeGroup"></path>
<path d="M17,66 L17,38 L2,66" id="Shape" fill="#D1C4B1" sketch:type="MSShapeGroup"></path>
<g id="Rectangle-5-+-&quot;World!&quot;" transform="translate(15.000000, 0.000000)">
<path d="M18.9106925,0.395208397 L73.4146415,58.8435379 L55.0893075,75.9321883 L0.585358502,17.4838588 L18.9106925,0.395208397 L18.9106925,0.395208397 Z" id="Rectangle-5" stroke="#8A704D" stroke-width="2" fill="#FFF9EB" sketch:type="MSShapeGroup"></path>
<text id="&quot;Hello!&quot;" sketch:type="MSTextLayer" transform="translate(39.885486, 40.782373) rotate(47.000000) translate(-39.885486, -40.782373) " font-family="Open Sans" font-size="14" font-weight="526" fill="#8A704D">
<tspan x="10.392998" y="46.2823729">"Hello!"</tspan>
</text>
</g>
<path d="M0,68 L0,122.729971 C0,126.150501 1.4836395,128 4.38712201,128 L104.473443,128 C107.59502,128 110,125.4521 110,124.524372 L110,68 L0,68 L0,68 Z" id="Shape" fill="#D1C4B1" sketch:type="MSShapeGroup"></path>
</g>
<text id="Message" sketch:type="MSTextLayer" font-family="Open Sans" font-size="18" font-weight="526" fill="#FFFFFF">
<tspan x="17" y="105">Message</tspan>
</text>
</g>
</g>
</g>
</svg>
<svg width="148" height="128" viewBox="0 0 148 128" xmlns="http://www.w3.org/2000/svg"><title>noun_1211_cc + Message</title><desc>Created with Sketch.</desc><g fill="none" fill-rule="evenodd"><path d="M17 37.196h112.558v42.95c0 .373-.08.862-.28 1.294-.2.433-16.573 35.56-16.573 35.56V62.64l16.854-25.444L148 9H35.44L17 37.196zM17 66V38L2 66" fill="#D1C4B1"/><path d="M33.91.395l54.505 58.45L70.09 75.93 15.584 17.484 33.91.394z" stroke="#8A704D" stroke-width="2" fill="#FFF9EB"/><text transform="matrix(.682 .731 -.731 .682 15 0)" font-family="Open Sans" font-size="14" font-weight="526" fill="#8A704D"><tspan x="10.393" y="46.282">&amp;quot;Hello!&amp;quot;</tspan></text><path d="M0 68v54.73c0 3.42 1.484 5.27 4.387 5.27h100.086c3.122 0 5.527-2.548 5.527-3.476V68H0z" fill="#D1C4B1"/><text font-family="Open Sans" font-size="18" font-weight="526" fill="#fff" transform="translate(-161 -71) translate(161 71)"><tspan x="17" y="105">Message</tspan></text></g></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.5 KiB

After

Width:  |  Height:  |  Size: 965 B

Before After
Before After

48
1-js/2-first-steps/5-variables/variable-change.svg
View file

@ -1,47 +1 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="253px" height="176px" viewBox="0 0 253 176" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
<!-- Generator: Sketch 3.2.2 (9983) - http://www.bohemiancoding.com/sketch -->
<title>Diagrams 2</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="variable-change" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
<rect id="Rectangle-2" stroke="#979797" fill="#E8E8E8" sketch:type="MSShapeGroup" transform="translate(142.959003, 41.528366) rotate(47.000000) translate(-142.959003, -41.528366) " x="103" y="29" width="79.918006" height="25.0567324"></rect>
<text id="&quot;Hello!&quot;" opacity="0.7" sketch:type="MSTextLayer" transform="translate(146.500000, 43.500000) rotate(47.000000) translate(-146.500000, -43.500000) " font-family="Open Sans" font-size="14" font-weight="normal" fill="#373535">
<tspan x="122" y="49">"Hello!"</tspan>
</text>
<g id="trash62" sketch:type="MSLayerGroup" transform="translate(222.000000, 0.000000)" fill="#979797">
<g id="Group" sketch:type="MSShapeGroup">
<rect id="Rectangle-path" x="20.6666667" y="10.6296296" width="1.47619048" height="25.8148148"></rect>
<rect id="Rectangle-path" x="14.7619048" y="10.6296296" width="1.47619048" height="25.8148148"></rect>
<rect id="Rectangle-path" x="8.85714286" y="10.6296296" width="1.47619048" height="25.8148148"></rect>
<path d="M25.0952381,6.07407407 L22.1428571,6.07407407 L22.1428571,3.03703704 C22.1428571,1.36666667 20.8142857,0 19.1904762,0 L11.8095238,0 C10.1857143,0 8.85714286,1.36666667 8.85714286,3.03703704 L8.85714286,6.07407407 L5.9047619,6.07407407 L0,6.07407407 L0,7.59259259 L2.95238095,7.59259259 L2.95238095,36.4444444 C2.95238095,39.0259259 4.87142857,41 7.38095238,41 L23.6190476,41 C26.1285714,41 28.047619,39.0259259 28.047619,36.4444444 L28.047619,7.59259259 L31,7.59259259 L31,6.07407407 L25.0952381,6.07407407 L25.0952381,6.07407407 Z M10.3333333,3.03703704 C10.3333333,2.12592593 10.9238095,1.51851852 11.8095238,1.51851852 L19.1904762,1.51851852 C20.0761905,1.51851852 20.6666667,2.12592593 20.6666667,3.03703704 L20.6666667,6.07407407 L10.3333333,6.07407407 L10.3333333,3.03703704 L10.3333333,3.03703704 Z M26.5714286,36.4444444 C26.5714286,38.1148148 25.2428571,39.4814815 23.6190476,39.4814815 L7.38095238,39.4814815 C5.75714286,39.4814815 4.42857143,38.1148148 4.42857143,36.4444444 L4.42857143,7.59259259 L26.5714286,7.59259259 L26.5714286,36.4444444 L26.5714286,36.4444444 Z" id="Shape"></path>
</g>
</g>
<g id="left221-2" sketch:type="MSLayerGroup" transform="translate(192.401869, 23.588287) scale(-1, 1) rotate(-2.000000) translate(-192.401869, -23.588287) translate(155.931845, 9.197409)" fill="#979797">
<path d="M30.2888412,8.13169869 L30.2888412,2.04595641 C30.2888412,1.48343299 29.9074863,0.974528918 29.3182523,0.751950009 C28.7290183,0.529371101 28.0453269,0.634584407 27.57924,1.02100612 L12.6611767,13.3658208 C12.339511,13.6321053 12.1566747,14.0030702 12.1566747,14.3907711 C12.1566747,14.7785786 12.339511,15.1495434 12.6611767,15.415828 L27.57924,27.7607493 C27.8829137,28.0125363 28.2799507,28.145039 28.6825798,28.145039 C28.8967804,28.145039 29.1132907,28.1071963 29.3182523,28.0296988 C29.9076079,27.8071199 30.2888412,27.2983224 30.2888412,26.7356924 L30.2888412,21.1354024 C31.6175657,21.1165343 33.6451775,21.0938287 35.802501,21.0938287 C37.792427,21.0938287 39.5378824,21.1126968 40.9895109,21.1497933 C48.9349919,21.3531843 58.2021466,26.6269613 58.2947804,26.6802609 C58.800255,26.970317 59.4474763,26.9888652 59.9717937,26.7260985 C60.4959895,26.4638647 60.809267,25.9663667 60.7816714,25.4375286 C60.0729372,11.8362304 36.5833242,8.72204447 30.2888412,8.13169869 L30.2888412,8.13169869 Z M41.0831173,18.3328056 C39.6006108,18.2946431 37.8240344,18.2753487 35.802501,18.2753487 C32.0474257,18.2753487 28.6784465,18.3428259 28.6447725,18.3434655 C27.7721664,18.3610544 27.0746164,18.9868976 27.0746164,19.7524923 L27.0746164,23.4683235 L16.1054057,14.3908777 L27.0746164,5.31353844 L27.0746164,9.41749696 C27.0746164,10.1579343 27.7290102,10.7723714 28.5718325,10.8233258 C28.83235,10.8392091 52.6405895,12.4104797 56.9260604,22.7161603 C53.2740738,20.9912804 46.9922337,18.4838565 41.0831173,18.3328056 L41.0831173,18.3328056 Z" id="Shape" sketch:type="MSShapeGroup"></path>
</g>
<g id="left221-3" sketch:type="MSLayerGroup" transform="translate(26.401869, 52.588287) scale(-1, 1) rotate(-44.000000) translate(-26.401869, -52.588287) translate(-10.068155, 38.197409)" fill="#979797">
<path d="M30.2888412,8.13169869 L30.2888412,2.04595641 C30.2888412,1.48343299 29.9074863,0.974528918 29.3182523,0.751950009 C28.7290183,0.529371101 28.0453269,0.634584407 27.57924,1.02100612 L12.6611767,13.3658208 C12.339511,13.6321053 12.1566747,14.0030702 12.1566747,14.3907711 C12.1566747,14.7785786 12.339511,15.1495434 12.6611767,15.415828 L27.57924,27.7607493 C27.8829137,28.0125363 28.2799507,28.145039 28.6825798,28.145039 C28.8967804,28.145039 29.1132907,28.1071963 29.3182523,28.0296988 C29.9076079,27.8071199 30.2888412,27.2983224 30.2888412,26.7356924 L30.2888412,21.1354024 C31.6175657,21.1165343 33.6451775,21.0938287 35.802501,21.0938287 C37.792427,21.0938287 39.5378824,21.1126968 40.9895109,21.1497933 C48.9349919,21.3531843 58.2021466,26.6269613 58.2947804,26.6802609 C58.800255,26.970317 59.4474763,26.9888652 59.9717937,26.7260985 C60.4959895,26.4638647 60.809267,25.9663667 60.7816714,25.4375286 C60.0729372,11.8362304 36.5833242,8.72204447 30.2888412,8.13169869 L30.2888412,8.13169869 Z M41.0831173,18.3328056 C39.6006108,18.2946431 37.8240344,18.2753487 35.802501,18.2753487 C32.0474257,18.2753487 28.6784465,18.3428259 28.6447725,18.3434655 C27.7721664,18.3610544 27.0746164,18.9868976 27.0746164,19.7524923 L27.0746164,23.4683235 L16.1054057,14.3908777 L27.0746164,5.31353844 L27.0746164,9.41749696 C27.0746164,10.1579343 27.7290102,10.7723714 28.5718325,10.8233258 C28.83235,10.8392091 52.6405895,12.4104797 56.9260604,22.7161603 C53.2740738,20.9912804 46.9922337,18.4838565 41.0831173,18.3328056 L41.0831173,18.3328056 Z" id="Shape" sketch:type="MSShapeGroup"></path>
</g>
<path d="M44.5,117 L146.5,117" id="Line-2" stroke="#979797" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<path d="M2.5,173.5 L44.5,117.5" id="Line" stroke="#979797" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<path d="M133.5,172.5 L175.5,116.5" id="Line-3" stroke="#979797" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<path d="M44.5,77 L176.5,77" id="Line-7" stroke="#979797" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<path d="M2.5,133.5 L44.5,77.5" id="Line-8" stroke="#979797" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<path d="M133.5,133.5 L175.5,77.5" id="Line-9" stroke="#979797" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<path d="M44,117.5 L44,77.5" id="Line-4" stroke="#979797" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<rect id="Rectangle-5" stroke="#979797" stroke-width="2" fill="#E8E8E8" sketch:type="MSShapeGroup" transform="translate(82.959003, 108.528366) rotate(47.000000) translate(-82.959003, -108.528366) " x="43" y="96" width="79.918006" height="25.0567324"></rect>
<text id="&quot;World!&quot;" sketch:type="MSTextLayer" transform="translate(86.500000, 110.500000) rotate(47.000000) translate(-86.500000, -110.500000) " font-family="Open Sans" font-size="14" font-weight="normal" fill="#373535">
<tspan x="59" y="116">"World!"</tspan>
</text>
<path d="M176,116 L176,77.5" id="Line-5" stroke="#979797" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<rect id="Rectangle-4" stroke="#979797" stroke-width="2" fill="#FFFFFF" sketch:type="MSShapeGroup" x="1" y="134" width="133" height="40"></rect>
<g id="Rectangle-3-+-Oval-1-+-message" sketch:type="MSLayerGroup" transform="translate(38.000000, 147.000000)">
<rect id="Rectangle-3" stroke="#979797" fill="#FFFFFF" sketch:type="MSShapeGroup" x="0" y="0" width="63" height="16"></rect>
<circle id="Oval-1" stroke="#979797" sketch:type="MSShapeGroup" cx="3.5" cy="3.5" r="1.5"></circle>
<text id="message" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#373535">
<tspan x="7" y="12">message</tspan>
</text>
</g>
</g>
</svg>
<svg width="253" height="176" viewBox="0 0 253 176" xmlns="http://www.w3.org/2000/svg"><title>Diagrams 2</title><desc>Created with Sketch.</desc><g fill="none" fill-rule="evenodd"><path stroke="#979797" fill="#E8E8E8" d="M124.865 3.774l54.504 58.42-18.32 17.09-54.505-58.42z"/><text opacity=".7" transform="rotate(47 146.5 43.5)" font-family="Open Sans" font-size="14" fill="#373535"><tspan x="122" y="49">&amp;quot;Hello!&amp;quot;</tspan></text><g fill="#979797"><path d="M242.667 10.63h1.476v25.815h-1.476zm-5.905 0h1.476v25.815h-1.476zm-5.905 0h1.476v25.815h-1.476zM247.095 6.074h-2.952V3.037c0-1.67-1.33-3.037-2.953-3.037h-7.38c-1.624 0-2.953 1.367-2.953 3.037v3.037H222v1.52h2.952v28.85c0 2.582 1.92 4.556 4.43 4.556h16.237c2.51 0 4.425-1.974 4.425-4.556V7.594H253v-1.52h-5.905zm-14.762-3.037c0-.91.59-1.518 1.477-1.518h7.38c.886 0 1.477.603 1.477 1.514V6.07h-10.334V3.038zm16.238 33.407c0 1.67-1.324 3.037-2.95 3.037h-16.24c-1.62 0-2.95-1.362-2.95-3.033V7.597h22.14v28.85z"/></g><path d="M198.796 17.55l.213-6.078c.02-.562.414-1.057 1.01-1.26.597-.2 1.277-.072 1.73.33l14.47 12.855c.313.278.482.655.47 1.042-.015.383-.21.75-.54 1.002l-15.336 11.81c-.312.242-.714.36-1.116.346-.216-.007-.43-.053-.63-.137-.584-.242-.947-.764-.927-1.326l.197-5.595c-1.327-.065-3.35-.16-5.507-.234-1.988-.07-3.732-.112-5.184-.126-7.945-.074-17.388 4.87-17.48 4.92-.517.27-1.165.268-1.68-.013-.514-.28-.81-.788-.763-1.315 1.184-13.563 24.76-15.852 31.068-16.222zm-11.14 9.815c1.482.013 3.257.056 5.277.127 3.75.13 7.114.317 7.148.32.875.047 1.55.696 1.52 1.46l-.13 3.713 11.28-8.685-10.64-9.45-.144 4.1c-.026.74-.7 1.33-1.545 1.35-.26.01-24.1.746-28.742 10.89 3.71-1.594 10.072-3.88 15.98-3.823zM35.196 52.383l4.23-4.376c.39-.404 1.02-.505 1.598-.256.578.25.996.805 1.063 1.407L44.233 68.4c.047.414-.08.807-.35 1.086-.27.28-.658.42-1.074.386l-19.31-1.49c-.395-.03-.77-.21-1.06-.49-.156-.15-.285-.328-.378-.526-.27-.57-.19-1.2.2-1.605l3.893-4.024c-.943-.937-2.385-2.363-3.936-3.862-1.43-1.382-2.7-2.582-3.77-3.564-5.854-5.377-16.18-8.026-16.286-8.05-.566-.145-1.044-.58-1.238-1.134-.196-.553-.075-1.13.312-1.49 9.96-9.286 29.015 4.8 33.95 8.75zm-14.85-.167c1.09 1.002 2.383 2.223 3.837 3.628 2.7 2.61 5.075 5 5.1 5.024.614.62.68 1.554.148 2.104l-2.58 2.672L41.05 66.74l-1.58-14.15-2.85 2.95c-.515.537-1.413.52-2.054-.025-.198-.17-18.408-15.587-28.652-11.156 3.826 1.297 10.085 3.86 14.44 7.86z" fill="#979797"/><path d="M44.5 117h102m-144 56.5l42-56m89 55l42-56M44.5 77h132m-174 56.5l42-56m89 56l42-56M44 117.5v-40" stroke="#979797" stroke-width="2" stroke-linecap="square"/><path stroke="#979797" stroke-width="2" fill="#E8E8E8" d="M64.865 70.774l54.504 58.42-18.32 17.09-54.505-58.42z"/><text transform="rotate(47 86.5 110.5)" font-family="Open Sans" font-size="14" fill="#373535"><tspan x="59" y="116">&amp;quot;World!&amp;quot;</tspan></text><path d="M176 116V77.5" stroke="#979797" stroke-width="2" stroke-linecap="square"/><path stroke="#979797" stroke-width="2" fill="#fff" d="M1 134h133v40H1z"/><g transform="translate(38 147)"><path stroke="#979797" fill="#fff" d="M0 0h63v16H0z"/><circle stroke="#979797" cx="3.5" cy="3.5" r="1.5"/><text font-family="Consolas" font-size="14" fill="#373535"><tspan x="7" y="12">message</tspan></text></g></g></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 8.7 KiB

After

Width:  |  Height:  |  Size: 3.2 KiB

Before After
Before After

28
1-js/2-first-steps/5-variables/variable-gray.svg
View file

@ -1,27 +1 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="148px" height="128px" viewBox="0 0 148 128" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
<!-- Generator: Sketch 3.2.2 (9983) - http://www.bohemiancoding.com/sketch -->
<title>noun_1211_cc + Message</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="combined-grey" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
<g id="variable" sketch:type="MSArtboardGroup" transform="translate(-161.000000, -71.000000)">
<g id="noun_1211_cc-+-Message" sketch:type="MSLayerGroup" transform="translate(161.000000, 71.000000)">
<g id="noun_1211_cc">
<path d="M17,37.1960457 L129.557785,37.1960457 L129.557785,80.1456641 C129.557785,80.5185728 129.479295,81.0083855 129.279367,81.4404861 C129.07944,81.8725868 112.704625,117 112.704625,117 L112.704625,62.6396695 L129.559266,37.1960457 L148,9 L35.4407339,9 L17,37.1960457 L17,37.1960457 Z" id="Shape" fill="#C7C7C7" sketch:type="MSShapeGroup"></path>
<path d="M17,66 L17,38 L2,66" id="Shape" fill="#C7C7C7" sketch:type="MSShapeGroup"></path>
<g id="Rectangle-5-+-&quot;World!&quot;" transform="translate(15.000000, 0.000000)">
<path d="M18.9106925,0.395208397 L73.4146415,58.8435379 L55.0893075,75.9321883 L0.585358502,17.4838588 L18.9106925,0.395208397 L18.9106925,0.395208397 Z" id="Rectangle-5" stroke="#8A704D" stroke-width="2" fill="#FFF9EB" sketch:type="MSShapeGroup"></path>
<text id="&quot;Hello!&quot;" sketch:type="MSTextLayer" transform="translate(39.885486, 40.782373) rotate(47.000000) translate(-39.885486, -40.782373) " font-family="Open Sans" font-size="14" font-weight="526" fill="#8A704D">
<tspan x="10.392998" y="46.2823729">"Hello!"</tspan>
</text>
</g>
<path d="M0,68 L0,122.729971 C0,126.150501 1.4836395,128 4.38712201,128 L104.473443,128 C107.59502,128 110,125.4521 110,124.524372 L110,68 L0,68 L0,68 Z" id="Shape" fill="#C7C7C7" sketch:type="MSShapeGroup"></path>
</g>
<text id="Message" sketch:type="MSTextLayer" font-family="Open Sans" font-size="18" font-weight="526" fill="#FFFFFF">
<tspan x="17" y="105">Message</tspan>
</text>
</g>
</g>
</g>
</svg>
<svg width="148" height="128" viewBox="0 0 148 128" xmlns="http://www.w3.org/2000/svg"><title>noun_1211_cc + Message</title><desc>Created with Sketch.</desc><g fill="none" fill-rule="evenodd"><path d="M17 37.196h112.558v42.95c0 .373-.08.862-.28 1.294-.2.433-16.573 35.56-16.573 35.56V62.64l16.854-25.444L148 9H35.44L17 37.196zM17 66V38L2 66" fill="#C7C7C7"/><path d="M33.91.395l54.505 58.45L70.09 75.93 15.584 17.484 33.91.394z" stroke="#8A704D" stroke-width="2" fill="#FFF9EB"/><text transform="matrix(.682 .731 -.731 .682 15 0)" font-family="Open Sans" font-size="14" font-weight="526" fill="#8A704D"><tspan x="10.393" y="46.282">&amp;quot;Hello!&amp;quot;</tspan></text><path d="M0 68v54.73c0 3.42 1.484 5.27 4.387 5.27h100.086c3.122 0 5.527-2.548 5.527-3.476V68H0z" fill="#C7C7C7"/><text font-family="Open Sans" font-size="18" font-weight="526" fill="#fff" transform="translate(-161 -71) translate(161 71)"><tspan x="17" y="105">Message</tspan></text></g></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.5 KiB

After

Width:  |  Height:  |  Size: 965 B

Before After
Before After

28
1-js/2-first-steps/5-variables/variable-green.svg
View file

@ -1,27 +1 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="148px" height="128px" viewBox="0 0 148 128" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
<!-- Generator: Sketch 3.2.2 (9983) - http://www.bohemiancoding.com/sketch -->
<title>noun_1211_cc + Message</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="combined-green" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
<g id="variable" sketch:type="MSArtboardGroup" transform="translate(-161.000000, -71.000000)">
<g id="noun_1211_cc-+-Message" sketch:type="MSLayerGroup" transform="translate(161.000000, 71.000000)">
<g id="noun_1211_cc">
<path d="M17,37.1960457 L129.557785,37.1960457 L129.557785,80.1456641 C129.557785,80.5185728 129.479295,81.0083855 129.279367,81.4404861 C129.07944,81.8725868 112.704625,117 112.704625,117 L112.704625,62.6396695 L129.559266,37.1960457 L148,9 L35.4407339,9 L17,37.1960457 L17,37.1960457 Z" id="Shape" fill="#CFCE95" sketch:type="MSShapeGroup"></path>
<path d="M17,66 L17,38 L2,66" id="Shape" fill="#CFCE95" sketch:type="MSShapeGroup"></path>
<g id="Rectangle-5-+-&quot;World!&quot;" transform="translate(15.000000, 0.000000)">
<path d="M18.9106925,0.395208397 L73.4146415,58.8435379 L55.0893075,75.9321883 L0.585358502,17.4838588 L18.9106925,0.395208397 L18.9106925,0.395208397 Z" id="Rectangle-5" stroke="#8A704D" stroke-width="2" fill="#FFF9EB" sketch:type="MSShapeGroup"></path>
<text id="&quot;Hello!&quot;" sketch:type="MSTextLayer" transform="translate(39.885486, 40.782373) rotate(47.000000) translate(-39.885486, -40.782373) " font-family="Open Sans" font-size="14" font-weight="526" fill="#8A704D">
<tspan x="10.392998" y="46.2823729">"Hello!"</tspan>
</text>
</g>
<path d="M0,68 L0,122.729971 C0,126.150501 1.4836395,128 4.38712201,128 L104.473443,128 C107.59502,128 110,125.4521 110,124.524372 L110,68 L0,68 L0,68 Z" id="Shape" fill="#CFCE95" sketch:type="MSShapeGroup"></path>
</g>
<text id="Message" sketch:type="MSTextLayer" font-family="Open Sans" font-size="18" font-weight="526" fill="#FFFFFF">
<tspan x="17" y="105">Message</tspan>
</text>
</g>
</g>
</g>
</svg>
<svg width="148" height="128" viewBox="0 0 148 128" xmlns="http://www.w3.org/2000/svg"><title>noun_1211_cc + Message</title><desc>Created with Sketch.</desc><g fill="none" fill-rule="evenodd"><path d="M17 37.196h112.558v42.95c0 .373-.08.862-.28 1.294-.2.433-16.573 35.56-16.573 35.56V62.64l16.854-25.444L148 9H35.44L17 37.196zM17 66V38L2 66" fill="#CFCE95"/><path d="M33.91.395l54.505 58.45L70.09 75.93 15.584 17.484 33.91.394z" stroke="#8A704D" stroke-width="2" fill="#FFF9EB"/><text transform="matrix(.682 .731 -.731 .682 15 0)" font-family="Open Sans" font-size="14" font-weight="526" fill="#8A704D"><tspan x="10.393" y="46.282">&amp;quot;Hello!&amp;quot;</tspan></text><path d="M0 68v54.73c0 3.42 1.484 5.27 4.387 5.27h100.086c3.122 0 5.527-2.548 5.527-3.476V68H0z" fill="#CFCE95"/><text font-family="Open Sans" font-size="18" font-weight="526" fill="#fff" transform="translate(-161 -71) translate(161 71)"><tspan x="17" y="105">Message</tspan></text></g></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.5 KiB

After

Width:  |  Height:  |  Size: 965 B

Before After
Before After

28
1-js/2-first-steps/5-variables/variable.svg
View file

@ -1,27 +1 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="148px" height="128px" viewBox="0 0 148 128" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
<!-- Generator: Sketch 3.2.2 (9983) - http://www.bohemiancoding.com/sketch -->
<title>noun_1211_cc + Message</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="combined" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
<g id="variable" sketch:type="MSArtboardGroup" transform="translate(-161.000000, -71.000000)">
<g id="noun_1211_cc-+-Message" sketch:type="MSLayerGroup" transform="translate(161.000000, 71.000000)">
<g id="noun_1211_cc">
<path d="M17,37.1960457 L129.557785,37.1960457 L129.557785,80.1456641 C129.557785,80.5185728 129.479295,81.0083855 129.279367,81.4404861 C129.07944,81.8725868 112.704625,117 112.704625,117 L112.704625,62.6396695 L129.559266,37.1960457 L148,9 L35.4407339,9 L17,37.1960457 L17,37.1960457 Z" id="Shape" fill="#E7C392" sketch:type="MSShapeGroup"></path>
<path d="M17,66 L17,38 L2,66" id="Shape" fill="#E7C392" sketch:type="MSShapeGroup"></path>
<g id="Rectangle-5-+-&quot;World!&quot;" transform="translate(15.000000, 0.000000)">
<path d="M18.9106925,0.395208397 L73.4146415,58.8435379 L55.0893075,75.9321883 L0.585358502,17.4838588 L18.9106925,0.395208397 L18.9106925,0.395208397 Z" id="Rectangle-5" stroke="#8A704D" stroke-width="2" fill="#FFF9EB" sketch:type="MSShapeGroup"></path>
<text id="&quot;Hello!&quot;" sketch:type="MSTextLayer" transform="translate(39.885486, 40.782373) rotate(47.000000) translate(-39.885486, -40.782373) " font-family="Open Sans" font-size="14" font-weight="526" fill="#8A704D">
<tspan x="10.392998" y="46.2823729">"Hello!"</tspan>
</text>
</g>
<path d="M0,68 L0,122.729971 C0,126.150501 1.4836395,128 4.38712201,128 L104.473443,128 C107.59502,128 110,125.4521 110,124.524372 L110,68 L0,68 L0,68 Z" id="Shape" fill="#E7C392" sketch:type="MSShapeGroup"></path>
</g>
<text id="Message" sketch:type="MSTextLayer" font-family="Open Sans" font-size="18" font-weight="526" fill="#FFFFFF">
<tspan x="17" y="105">Message</tspan>
</text>
</g>
</g>
</g>
</svg>
<svg width="148" height="128" viewBox="0 0 148 128" xmlns="http://www.w3.org/2000/svg"><title>noun_1211_cc + Message</title><desc>Created with Sketch.</desc><g fill="none" fill-rule="evenodd"><path d="M17 37.196h112.558v42.95c0 .373-.08.862-.28 1.294-.2.433-16.573 35.56-16.573 35.56V62.64l16.854-25.444L148 9H35.44L17 37.196zM17 66V38L2 66" fill="#E7C392"/><path d="M33.91.395l54.505 58.45L70.09 75.93 15.584 17.484 33.91.394z" stroke="#8A704D" stroke-width="2" fill="#FFF9EB"/><text transform="matrix(.682 .731 -.731 .682 15 0)" font-family="Open Sans" font-size="14" font-weight="526" fill="#8A704D"><tspan x="10.393" y="46.282">&amp;quot;Hello!&amp;quot;</tspan></text><path d="M0 68v54.73c0 3.42 1.484 5.27 4.387 5.27h100.086c3.122 0 5.527-2.548 5.527-3.476V68H0z" fill="#E7C392"/><text font-family="Open Sans" font-size="18" font-weight="526" fill="#fff" transform="translate(-161 -71) translate(161 71)"><tspan x="17" y="105">Message</tspan></text></g></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.5 KiB

After

Width:  |  Height:  |  Size: 965 B

Before After
Before After

BIN
1-js/3-writing-js/1-debugging-chrome/chrome_break_error@2x.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 154 KiB

After

Width:  |  Height:  |  Size: 44 KiB

Before After
Before After

BIN
1-js/3-writing-js/1-debugging-chrome/chrome_sources@2x.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 264 KiB

After

Width:  |  Height:  |  Size: 41 KiB

Before After
Before After

BIN
1-js/3-writing-js/1-debugging-chrome/chrome_sources_break@2x.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 153 KiB

After

Width:  |  Height:  |  Size: 42 KiB

Before After
Before After

BIN
1-js/3-writing-js/1-debugging-chrome/chrome_sources_breakpoint@2x.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 225 KiB

After

Width:  |  Height:  |  Size: 34 KiB

Before After
Before After

BIN
1-js/3-writing-js/1-debugging-chrome/chrome_sources_buttons@2x.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 130 KiB

After

Width:  |  Height:  |  Size: 39 KiB

Before After
Before After

BIN
1-js/3-writing-js/1-debugging-chrome/console_error@2x.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 50 KiB

After

Width:  |  Height:  |  Size: 13 KiB

Before After
Before After

BIN
1-js/3-writing-js/1-debugging-chrome/manage1@2x.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3 KiB

After

Width:  |  Height:  |  Size: 391 B

Before After
Before After

BIN
1-js/3-writing-js/1-debugging-chrome/manage2@2x.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3.5 KiB

After

Width:  |  Height:  |  Size: 482 B

Before After
Before After

BIN
1-js/3-writing-js/1-debugging-chrome/manage3@2x.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3.1 KiB

After

Width:  |  Height:  |  Size: 257 B

Before After
Before After

BIN
1-js/3-writing-js/1-debugging-chrome/manage4@2x.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3.1 KiB

After

Width:  |  Height:  |  Size: 254 B

Before After
Before After

BIN
1-js/3-writing-js/1-debugging-chrome/manage5@2x.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3.6 KiB

After

Width:  |  Height:  |  Size: 520 B

Before After
Before After

BIN
1-js/3-writing-js/1-debugging-chrome/manage6@2x.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3 KiB

After

Width:  |  Height:  |  Size: 234 B

Before After
Before After

1736
1-js/3-writing-js/1-debugging-chrome/statusbarButtonGlyphs.svg
View file

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

Before

Width:  |  Height:  |  Size: 67 KiB

After

Width:  |  Height:  |  Size: 22 KiB

Before After
Before After

95
1-js/3-writing-js/2-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: 125 KiB

After

Width:  |  Height:  |  Size: 118 KiB

Before After
Before After

33
1-js/3-writing-js/2-coding-style/figure-bracket-style.svg
View file

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

Before

Width:  |  Height:  |  Size: 74 KiB

After

Width:  |  Height:  |  Size: 69 KiB

Before After
Before After

29
1-js/4-data-structures/4-object/object-person-1.svg
View file

@ -1,28 +1 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="112px" height="146px" viewBox="0 0 112 146" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
<!-- Generator: Sketch 3.2.2 (9983) - http://www.bohemiancoding.com/sketch -->
<title>Slice 1</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="object-person-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
<g id="noun_3865-(1)" sketch:type="MSLayerGroup" transform="translate(-68.000000, 0.000000)" fill="#000000">
<g id="Three_Stack_1_" sketch:type="MSShapeGroup">
<g id="Cabinet" transform="translate(68.200000, 0.033058)">
<path d="M107.53776,0.321282149 L4.06472,0.321282149 C2.02368,0.321282149 0.36952,1.40182215 0.36952,2.73508215 L0.36952,143.198802 C0.36952,144.532062 2.02368,145.612602 4.06472,145.612602 L107.53776,145.612602 C109.5788,145.612602 111.23296,144.532062 111.23296,143.198802 L111.23296,2.73508215 C111.23296,1.40182215 109.5788,0.321282149 107.53776,0.321282149 L107.53776,0.321282149 Z M101.5312,139.321282 L10.0688,139.321282 L10.0688,77.7692421 L101.5312,77.7692421 L101.5312,139.321282 L101.5312,139.321282 Z M101.5312,68.3996021 L10.0688,68.3996021 L10.0688,6.84756215 L101.5312,6.84756215 L101.5312,68.3996021 L101.5312,68.3996021 Z" id="Shape"></path>
</g>
<g id="Middle_Handle" transform="translate(0.000000, 18.000000)">
<path d="M137.34488,64.3626 L133.58024,64.3626 L133.58024,69.8868 C133.58024,70.32258 133.03712,70.67574 132.36752,70.67574 L115.39192,70.67574 C114.72232,70.67574 114.1792,70.32258 114.1792,69.8868 L114.1792,64.3626 L110.6576,64.3626 C109.99048,64.3626 109.44984,64.71252 109.44984,65.14506 L109.44984,73.04904 C109.44984,73.48158 109.99048,73.8315 110.6576,73.8315 L137.34488,73.8315 C138.012,73.8315 138.55264,73.48158 138.55264,73.04904 L138.55264,65.14506 C138.55264,64.71414 138.00952,64.3626 137.34488,64.3626 L137.34488,64.3626 Z" id="Shape"></path>
</g>
<g id="Top_Handle" transform="translate(108.500000, 9.404959)">
<path d="M28.84488,0.0375813223 L25.08024,0.0375813223 L25.08024,5.56178132 C25.08024,5.99756132 24.53712,6.35072132 23.86752,6.35072132 L6.89192,6.35072132 C6.22232,6.35072132 5.6792,5.99756132 5.6792,5.56178132 L5.6792,0.0375813223 L2.1576,0.0375813223 C1.49048,0.0375813223 0.94984,0.387501322 0.94984,0.820041322 L0.94984,8.72402132 C0.94984,9.15656132 1.49048,9.50648132 2.1576,9.50648132 L28.84488,9.50648132 C29.512,9.50648132 30.05264,9.15656132 30.05264,8.72402132 L30.05264,0.820041322 C30.05264,0.387501322 29.50952,0.0375813223 28.84488,0.0375813223 L28.84488,0.0375813223 Z" id="Shape"></path>
</g>
</g>
</g>
<text id="name" sketch:type="MSTextLayer" font-family="Open Sans" font-size="14" font-weight="bold" fill="#4990E2">
<tspan x="35" y="46">name</tspan>
</text>
<text id="age" sketch:type="MSTextLayer" font-family="Open Sans" font-size="14" font-weight="bold" fill="#4990E2">
<tspan x="42" y="119">age</tspan>
</text>
</g>
</svg>
<svg width="112" height="146" viewBox="0 0 112 146" xmlns="http://www.w3.org/2000/svg"><title>Slice 1</title><desc>Created with Sketch.</desc><g fill="none" fill-rule="evenodd"><path d="M107.738.354H4.265C2.225.354.57 1.434.57 2.768v140.464c0 1.333 1.654 2.414 3.695 2.414h103.473c2.04 0 3.695-1.08 3.695-2.414V2.768c0-1.333-1.654-2.414-3.695-2.414zm-6.007 139H10.27V77.802h91.46v61.552zm0-70.92H10.27V6.88h91.46v61.553zm-32.384 13.93H65.58v5.523c0 .436-.543.79-1.212.79H47.392c-.67 0-1.213-.354-1.213-.79v-5.524h-3.525c-.668 0-1.208.35-1.208.782v7.904c0 .43.54.78 1.207.78H69.34c.668 0 1.21-.35 1.21-.784V83.14c0-.43-.544-.78-1.21-.78zm0-72.92H65.58v5.523c0 .436-.543.79-1.212.79H47.392c-.67 0-1.213-.354-1.213-.79V9.443h-3.525c-.668 0-1.208.35-1.208.782v7.904c0 .43.54.78 1.207.78H69.34c.668 0 1.21-.35 1.21-.78V10.22c0-.432-.544-.782-1.21-.782z" fill="#000"/><text font-family="Open Sans" font-size="14" font-weight="bold" fill="#4990E2"><tspan x="35" y="46">name</tspan></text><text font-family="Open Sans" font-size="14" font-weight="bold" fill="#4990E2"><tspan x="42" y="119">age</tspan></text></g></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3.2 KiB

After

Width:  |  Height:  |  Size: 1.1 KiB

Before After
Before After

23
1-js/4-data-structures/4-object/object-person-2.svg
View file

@ -1,22 +1 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="112px" height="146px" viewBox="0 0 112 146" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
<!-- Generator: Sketch 3.2.2 (9983) - http://www.bohemiancoding.com/sketch -->
<title>Slice 1</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="object-person-2" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
<g id="noun_3865-(1)" sketch:type="MSLayerGroup" fill="#000000">
<g id="Three_Stack_1_" sketch:type="MSShapeGroup">
<g id="Cabinet" transform="translate(0.200000, 0.033058)">
<path d="M107.53776,0.321282149 L4.06472,0.321282149 C2.02368,0.321282149 0.36952,1.40182215 0.36952,2.73508215 L0.36952,143.198802 C0.36952,144.532062 2.02368,145.612602 4.06472,145.612602 L107.53776,145.612602 C109.5788,145.612602 111.23296,144.532062 111.23296,143.198802 L111.23296,2.73508215 C111.23296,1.40182215 109.5788,0.321282149 107.53776,0.321282149 L107.53776,0.321282149 Z M101.5312,137.321282 L10.0688,137.321282 L10.0688,6.84756215 L101.5312,6.84756215 L101.5312,137.321282 L101.5312,137.321282 Z" id="Shape"></path>
</g>
<g id="Top_Handle" transform="translate(40.500000, 9.404959)">
<path d="M28.84488,0.0375813223 L25.08024,0.0375813223 L25.08024,5.56178132 C25.08024,5.99756132 24.53712,6.35072132 23.86752,6.35072132 L6.89192,6.35072132 C6.22232,6.35072132 5.6792,5.99756132 5.6792,5.56178132 L5.6792,0.0375813223 L2.1576,0.0375813223 C1.49048,0.0375813223 0.94984,0.387501322 0.94984,0.820041322 L0.94984,8.72402132 C0.94984,9.15656132 1.49048,9.50648132 2.1576,9.50648132 L28.84488,9.50648132 C29.512,9.50648132 30.05264,9.15656132 30.05264,8.72402132 L30.05264,0.820041322 C30.05264,0.387501322 29.50952,0.0375813223 28.84488,0.0375813223 L28.84488,0.0375813223 Z" id="Shape"></path>
</g>
</g>
</g>
<text id="name" sketch:type="MSTextLayer" font-family="Open Sans" font-size="14" font-weight="bold" fill="#4990E2">
<tspan x="35" y="74">name</tspan>
</text>
</g>
</svg>
<svg width="112" height="146" viewBox="0 0 112 146" xmlns="http://www.w3.org/2000/svg"><title>Slice 1</title><desc>Created with Sketch.</desc><g fill="none" fill-rule="evenodd"><path d="M107.738.354H4.265C2.225.354.57 1.434.57 2.768v140.464c0 1.333 1.654 2.414 3.695 2.414h103.473c2.04 0 3.695-1.08 3.695-2.414V2.768c0-1.333-1.654-2.414-3.695-2.414zm-6.007 137H10.27V6.88h91.46v130.474zM69.346 9.444H65.58v5.523c0 .436-.543.79-1.212.79H47.392c-.67 0-1.213-.354-1.213-.79V9.443h-3.525c-.668 0-1.208.35-1.208.782v7.904c0 .43.54.78 1.207.78H69.34c.668 0 1.21-.35 1.21-.78V10.22c0-.433-.544-.782-1.21-.782z" fill="#000"/><text font-family="Open Sans" font-size="14" font-weight="bold" fill="#4990E2"><tspan x="35" y="74">name</tspan></text></g></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.2 KiB

After

Width:  |  Height:  |  Size: 746 B

Before After
Before After

28
1-js/4-data-structures/4-object/object-person-empty.svg
View file

@ -1,27 +1 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="112px" height="179px" viewBox="0 0 112 179" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
<!-- Generator: Sketch 3.2.2 (9983) - http://www.bohemiancoding.com/sketch -->
<title>Slice 1</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="object-person-empty" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
<path d="M48.5,29.5 L52.5,25.5" id="Line" stroke="#979797" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<path d="M44.5,29.5 L48.5,25.5" id="Line-2" stroke="#979797" stroke-linecap="square" sketch:type="MSShapeGroup" transform="translate(46.500000, 27.500000) scale(-1, 1) translate(-46.500000, -27.500000) "></path>
<path d="M48.5,14.5714286 L48.5,29.4285714" id="Line" stroke="#979797" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<g id="noun_3865-(1)" sketch:type="MSLayerGroup" transform="translate(-68.000000, 25.000000)">
<g id="Background_xA0_Image_1_"></g>
<g id="Three_Stack_1_" transform="translate(68.200000, 8.033058)" fill="#000000" sketch:type="MSShapeGroup">
<g id="Cabinet">
<path d="M107.53776,0.321282149 L4.06472,0.321282149 C2.02368,0.321282149 0.36952,1.40182215 0.36952,2.73508215 L0.36952,143.198802 C0.36952,144.532062 2.02368,145.612602 4.06472,145.612602 L107.53776,145.612602 C109.5788,145.612602 111.23296,144.532062 111.23296,143.198802 L111.23296,2.73508215 C111.23296,1.40182215 109.5788,0.321282149 107.53776,0.321282149 L107.53776,0.321282149 Z M101.5312,141.087942 L10.0688,141.087942 L10.0688,4.84756215 L101.5312,4.84756215 L101.5312,141.087942 L101.5312,141.087942 Z" id="Shape"></path>
</g>
</g>
</g>
<text id="Объект" sketch:type="MSTextLayer" font-family="Open Sans" font-size="16" font-weight="bold" sketch:alignment="middle">
<tspan x="52.5" y="89" fill="#DFDFDF"></tspan>
<tspan x="29.3203125" y="111" fill="#D8D8D8">пусто</tspan>
</text>
<text id="person" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="bold" fill="#000000">
<tspan x="27" y="8">person</tspan>
</text>
</g>
</svg>
<svg width="112" height="179" viewBox="0 0 112 179" xmlns="http://www.w3.org/2000/svg"><title>Slice 1</title><desc>Created with Sketch.</desc><g fill="none" fill-rule="evenodd"><path d="M48.5 29.5l4-4m-4 4l-4-4m4-10.93v14.86" stroke="#979797" stroke-linecap="square"/><path d="M107.738 33.354H4.265c-2.04 0-3.695 1.08-3.695 2.414v140.464c0 1.333 1.654 2.414 3.695 2.414h103.473c2.04 0 3.695-1.08 3.695-2.414V35.768c0-1.333-1.654-2.414-3.695-2.414zM101.73 174.12H10.27V37.88h91.46v136.24z" fill="#000"/><text font-family="Open Sans" font-size="16" font-weight="bold"><tspan x="29.32" y="111" fill="#D8D8D8">пусто</tspan></text><text font-family="Consolas" font-size="14" font-weight="bold" fill="#000"><tspan x="27" y="8">person</tspan></text></g></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.4 KiB

After

Width:  |  Height:  |  Size: 757 B

Before After
Before After

36
1-js/4-data-structures/4-object/object.svg
View file

@ -1,35 +1 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="99px" height="128px" viewBox="0 0 99 128" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
<!-- Generator: Sketch 3.2.2 (9983) - http://www.bohemiancoding.com/sketch -->
<title>Slice 1</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="object" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
<g id="noun_3865-(1)" sketch:type="MSLayerGroup" transform="translate(-61.000000, -7.000000)">
<g id="Background_xA0_Image_1_"></g>
<g id="Three_Stack_1_" fill="#000000" sketch:type="MSShapeGroup">
<g id="Cabinet" transform="translate(60.775000, 7.041322)">
<path d="M95.83002,0.281617686 L3.62219,0.281617686 C1.80336,0.281617686 0.32929,1.22875769 0.32929,2.39741769 L0.32929,125.519938 C0.32929,126.688598 1.80336,127.635738 3.62219,127.635738 L95.83002,127.635738 C97.64885,127.635738 99.12292,126.688598 99.12292,125.519938 L99.12292,2.39741769 C99.12292,1.22875769 97.64885,0.281617686 95.83002,0.281617686 L95.83002,0.281617686 Z M90.4774,123.669678 L8.9726,123.669678 L8.9726,86.5082777 L90.4774,86.5082777 L90.4774,123.669678 L90.4774,123.669678 Z M90.4774,82.5393777 L8.9726,82.5393777 L8.9726,45.3779777 L90.4774,45.3779777 L90.4774,82.5393777 L90.4774,82.5393777 Z M90.4774,41.4104977 L8.9726,41.4104977 L8.9726,4.24909769 L90.4774,4.24909769 L90.4774,41.4104977 L90.4774,41.4104977 Z" id="Shape"></path>
</g>
<g id="Bottom_Handle">
<path d="M122.18648,97.54548 L118.8317,97.54548 L118.8317,102.3891 C118.8317,102.77108 118.34771,103.08064 117.75101,103.08064 L102.62135,103.08064 C102.02465,103.08064 101.54066,102.77108 101.54066,102.3891 L101.54066,97.54548 L98.40246,97.54548 C97.80797,97.54548 97.32619,97.85362 97.32619,98.23276 L97.32619,105.16094 C97.32619,105.54008 97.80797,105.8468 98.40246,105.8468 L122.18427,105.8468 C122.77876,105.8468 123.26054,105.54008 123.26054,105.16094 L123.26054,98.23276 C123.26054,97.85362 122.78097,97.54548 122.18648,97.54548 L122.18648,97.54548 Z" id="Shape"></path>
</g>
<g id="Middle_Handle">
<path d="M122.39201,56.4166 L119.03723,56.4166 L119.03723,61.2588 C119.03723,61.64078 118.55324,61.95034 117.95654,61.95034 L102.82909,61.95034 C102.23239,61.95034 101.7484,61.64078 101.7484,61.2588 L101.7484,56.4166 L98.6102,56.4166 C98.01571,56.4166 97.53393,56.72332 97.53393,57.10246 L97.53393,64.03064 C97.53393,64.40978 98.01571,64.7165 98.6102,64.7165 L122.39201,64.7165 C122.9865,64.7165 123.46828,64.40978 123.46828,64.03064 L123.46828,57.10246 C123.46828,56.72474 122.98429,56.4166 122.39201,56.4166 L122.39201,56.4166 Z" id="Shape"></path>
</g>
<g id="Top_Handle" transform="translate(96.687500, 15.256198)">
<path d="M25.70451,0.0329416529 L22.34973,0.0329416529 L22.34973,4.87514165 C22.34973,5.25712165 21.86574,5.56668165 21.26904,5.56668165 L6.14159,5.56668165 C5.54489,5.56668165 5.0609,5.25712165 5.0609,4.87514165 L5.0609,0.0329416529 L1.9227,0.0329416529 C1.32821,0.0329416529 0.84643,0.339661653 0.84643,0.718801653 L0.84643,7.64698165 C0.84643,8.02612165 1.32821,8.33284165 1.9227,8.33284165 L25.70451,8.33284165 C26.299,8.33284165 26.78078,8.02612165 26.78078,7.64698165 L26.78078,0.718801653 C26.78078,0.339661653 26.29679,0.0329416529 25.70451,0.0329416529 L25.70451,0.0329416529 Z" id="Shape"></path>
</g>
</g>
</g>
<text id="ключ1" sketch:type="MSTextLayer" font-family="Open Sans" font-size="14" font-weight="bold" fill="#4990E2">
<tspan x="26" y="35">ключ1</tspan>
</text>
<text id="ключ2" sketch:type="MSTextLayer" font-family="Open Sans" font-size="14" font-weight="bold" fill="#4990E2">
<tspan x="26" y="74">ключ2</tspan>
</text>
<text id="ключ3" sketch:type="MSTextLayer" font-family="Open Sans" font-size="14" font-weight="bold" fill="#4990E2">
<tspan x="26" y="118">ключ3</tspan>
</text>
</g>
</svg>
<svg width="99" height="128" viewBox="0 0 99 128" xmlns="http://www.w3.org/2000/svg"><title>Slice 1</title><desc>Created with Sketch.</desc><g fill="none" fill-rule="evenodd"><path d="M95.605.323H3.397C1.577.323.104 1.27.104 2.438V125.56c0 1.17 1.474 2.117 3.293 2.117h92.208c1.82 0 3.293-.947 3.293-2.116V2.44c0-1.168-1.474-2.115-3.293-2.115zM90.252 123.71H8.748V86.55h81.504v37.16zm0-41.13H8.748V45.42h81.504v37.16zm0-41.13H8.748V4.29h81.504v37.16zM61.186 90.545h-3.354v4.844c0 .38-.484.69-1.08.69H41.62c-.597 0-1.08-.31-1.08-.69V90.54H37.4c-.594 0-1.076.31-1.076.688v6.93c0 .38.482.686 1.076.686h23.782c.595 0 1.077-.307 1.077-.686v-6.926c0-.38-.48-.688-1.077-.688zm.206-41.128h-3.355v4.842c0 .38-.484.69-1.08.69H41.83c-.598 0-1.082-.31-1.082-.69v-4.846H37.61c-.594 0-1.076.306-1.076.685v6.93c0 .38.482.684 1.076.684h23.782c.595 0 1.076-.306 1.076-.685V50.1c0-.376-.484-.684-1.076-.684zm0-41.127H58.04v4.84c0 .383-.484.693-1.08.693H41.83c-.597 0-1.08-.31-1.08-.692V8.29h-3.14c-.594 0-1.076.306-1.076.685v6.928c0 .38.482.686 1.077.686h23.786c.594 0 1.076-.31 1.076-.69V8.975c0-.38-.484-.686-1.076-.686z" fill="#000"/><text font-family="Open Sans" font-size="14" font-weight="bold" fill="#4990E2"><tspan x="26" y="35">ключ1</tspan></text><text font-family="Open Sans" font-size="14" font-weight="bold" fill="#4990E2"><tspan x="26" y="74">ключ2</tspan></text><text font-family="Open Sans" font-size="14" font-weight="bold" fill="#4990E2"><tspan x="26" y="118">ключ3</tspan></text></g></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 4.2 KiB

After

Width:  |  Height:  |  Size: 1.5 KiB

Before After
Before After

BIN
1-js/4-data-structures/6-object-reference/object-reference-console@2x.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 123 KiB

After

Width:  |  Height:  |  Size: 32 KiB

Before After
Before After

48
1-js/4-data-structures/6-object-reference/variable-contains-reference.svg
View file

@ -1,47 +1 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="297px" height="199px" viewBox="0 0 297 199" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
<!-- Generator: Sketch 3.2.2 (9983) - http://www.bohemiancoding.com/sketch -->
<title>Slice 2</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="variable-contains-reference" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
<path d="M43.5,141 L145.5,141" id="Line-2" stroke="#979797" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<path d="M1.5,197.5 L43.5,141.5" id="Line" stroke="#979797" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<path d="M132.5,196.5 L174.5,140.5" id="Line-3" stroke="#979797" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<path d="M43.5,101 L175.5,101" id="Line-7" stroke="#979797" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<path d="M1.5,157.5 L43.5,101.5" id="Line-8" stroke="#979797" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<path d="M132.5,157.5 L174.5,101.5" id="Line-9" stroke="#979797" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<path d="M43,141.5 L43,101.5" id="Line-4" stroke="#979797" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<rect id="Rectangle-2" stroke="#979797" stroke-width="2" fill="#E8E8E8" sketch:type="MSShapeGroup" transform="translate(81.959003, 132.776161) rotate(47.000000) translate(-81.959003, -132.776161) " x="42" y="120.247795" width="79.918006" height="25.0567324"></rect>
<path d="M175,140 L175,101.5" id="Line-5" stroke="#979797" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<rect id="Rectangle-4" stroke="#979797" stroke-width="2" fill="#FFFFFF" sketch:type="MSShapeGroup" x="0" y="158" width="133" height="40"></rect>
<g id="Rectangle-3-+-Oval-1-+-message" sketch:type="MSLayerGroup" transform="translate(37.000000, 171.000000)">
<rect id="Rectangle-3" stroke="#979797" fill="#FFFFFF" sketch:type="MSShapeGroup" x="0" y="0" width="63" height="16"></rect>
<circle id="Oval-1" stroke="#979797" sketch:type="MSShapeGroup" cx="3.5" cy="3.5" r="1.5"></circle>
<text id="user" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#4990E2">
<tspan x="15" y="12">user</tspan>
</text>
</g>
<g id="noun_3865-(1)" sketch:type="MSLayerGroup" transform="translate(185.000000, 0.000000)" fill="#000000">
<g id="Three_Stack_1_" sketch:type="MSShapeGroup">
<g id="Cabinet" transform="translate(0.200000, 0.033058)">
<path d="M107.53776,0.321282149 L4.06472,0.321282149 C2.02368,0.321282149 0.36952,0.908809745 0.36952,1.63375009 L0.36952,78.0088142 C0.36952,78.7337546 2.02368,79.3212821 4.06472,79.3212821 L107.53776,79.3212821 C109.5788,79.3212821 111.23296,78.7337546 111.23296,78.0088142 L111.23296,1.63375009 C111.23296,0.908809745 109.5788,0.321282149 107.53776,0.321282149 L107.53776,0.321282149 Z M101.5312,72.9669421 L10.0688,72.9669421 L10.0688,6.84756215 L101.5312,6.84756215 L101.5312,72.9669421 L101.5312,72.9669421 Z" id="Shape"></path>
</g>
<g id="Top_Handle" transform="translate(40.500000, 9.404959)">
<path d="M28.84488,0.0375813223 L25.08024,0.0375813223 L25.08024,5.56178132 C25.08024,5.99756132 24.53712,6.35072132 23.86752,6.35072132 L6.89192,6.35072132 C6.22232,6.35072132 5.6792,5.99756132 5.6792,5.56178132 L5.6792,0.0375813223 L2.1576,0.0375813223 C1.49048,0.0375813223 0.94984,0.387501322 0.94984,0.820041322 L0.94984,8.72402132 C0.94984,9.15656132 1.49048,9.50648132 2.1576,9.50648132 L28.84488,9.50648132 C29.512,9.50648132 30.05264,9.15656132 30.05264,8.72402132 L30.05264,0.820041322 C30.05264,0.387501322 29.50952,0.0375813223 28.84488,0.0375813223 L28.84488,0.0375813223 Z" id="Shape"></path>
</g>
</g>
</g>
<text id="name" sketch:type="MSTextLayer" font-family="Open Sans" font-size="14" font-weight="bold" fill="#979797">
<tspan x="218" y="49">name</tspan>
</text>
<g id="noun_37574_cc" sketch:type="MSLayerGroup" transform="translate(127.000000, 83.500000) rotate(10.000000) translate(-127.000000, -83.500000) translate(72.000000, 36.000000)" fill="#000000">
<g id="Editor" transform="translate(54.754715, 47.398639) rotate(141.000000) translate(-54.754715, -47.398639) translate(-4.796384, 34.631516)" sketch:type="MSShapeGroup">
<path d="M67.2636383,25.5342454 L67.2636383,17.7965953 C67.2636383,17.7965953 3.56264802,17.9173072 2.58917769,0 C34.7901854,16.5161804 67.2668582,10.8327102 67.2668582,10.8327102 L67.2636383,3.09506005 L116.972573,14.3146527 L67.2636383,25.5342454 L67.2636383,25.5342454 Z M72.5431368,22.3343418 L72.5431368,16.3282175 C72.5431368,16.3282175 23.6262507,17.435782 9.14303504,4.96543295 C35.1656667,17.435782 72.5431345,11.9892017 72.5431345,11.9892017 L72.5431368,6.09642199 L107.216377,14.3146527 L72.5431368,22.3343418 L72.5431368,22.3343418 Z" id="left_arrow" transform="translate(59.780875, 12.767123) scale(-1, 1) translate(-59.780875, -12.767123) "></path>
</g>
</g>
<g id="noun_4093_cc" sketch:type="MSLayerGroup" transform="translate(73.000000, 126.000000)" fill="#010101">
<path d="M15.47568,0 L0.52464,0 C0.19664,0 0,0.138870968 0,0.370322581 L0,6.57074194 C0,6.80208065 0.19664,6.94083871 0.52464,6.94083871 L15.47568,6.94083871 C15.80352,6.94083871 16,6.80208065 16,6.57074194 L16,0.370322581 C16,0.138870968 15.80336,0 15.47568,0 L15.47568,0 Z M14.67984,0.555370968 L7.86896,4.34959677 L1.17744,0.555370968 L14.67984,0.555370968 L14.67984,0.555370968 Z M14.95088,6.38558065 L1.04912,6.38558065 C0.88512,6.38558065 0.78688,6.31614516 0.78688,6.20030645 L0.78688,1.03125806 L7.86896,4.99743548 L15.21296,0.884483871 L15.21296,6.20030645 C15.21312,6.31614516 15.11488,6.38558065 14.95088,6.38558065 L14.95088,6.38558065 Z" id="Shape" sketch:type="MSShapeGroup"></path>
</g>
</g>
</svg>
<svg width="297" height="199" viewBox="0 0 297 199" xmlns="http://www.w3.org/2000/svg"><title>Slice 2</title><desc>Created with Sketch.</desc><g fill="none" fill-rule="evenodd"><path d="M43.5 141h102m-144 56.5l42-56m89 55l42-56M43.5 101h132m-174 56.5l42-56m89 56l42-56M43 141.5v-40" stroke="#979797" stroke-width="2" stroke-linecap="square"/><path stroke="#979797" stroke-width="2" fill="#E8E8E8" d="M63.865 95.022l54.504 58.42-18.32 17.09-54.505-58.42z"/><path d="M175 140v-38.5" stroke="#979797" stroke-width="2" stroke-linecap="square"/><path stroke="#979797" stroke-width="2" fill="#fff" d="M0 158h133v40H0z"/><g transform="translate(37 171)"><path stroke="#979797" fill="#fff" d="M0 0h63v16H0z"/><circle stroke="#979797" cx="3.5" cy="3.5" r="1.5"/><text font-family="Consolas" font-size="14" fill="#4990E2"><tspan x="15" y="12">user</tspan></text></g><path d="M292.738.354H189.265c-2.04 0-3.695.588-3.695 1.313v76.375c0 .725 1.654 1.312 3.695 1.312h103.473c2.04 0 3.695-.587 3.695-1.312V1.667c0-.725-1.654-1.313-3.695-1.313zM286.73 73h-91.46V6.88h91.46V73zM254.345 9.443h-3.765v5.524c0 .436-.543.79-1.212.79h-16.976c-.67 0-1.213-.354-1.213-.79V9.443h-3.525c-.668 0-1.208.35-1.208.782v7.904c0 .43.54.78 1.207.78h26.687c.668 0 1.21-.35 1.21-.78V10.22c0-.432-.544-.782-1.21-.782z" fill="#000"/><text font-family="Open Sans" font-size="14" font-weight="bold" fill="#979797"><tspan x="218" y="49">name</tspan></text><path d="M126.932 68.668l3.752 6.77s-55.797 30.79-47.958 46.94c20.165-30.07 51.34-40.848 51.34-40.848l3.75 6.772 38.052-33.926-48.936 14.292zm6.17.24l2.914 5.254s-43.34 22.756-49.964 40.692C102.774 91.32 138.12 77.96 138.12 77.96l2.858 5.155 26.354-24.007-34.23 9.8z" fill="#000"/><path d="M88.476 126h-14.95c-.33 0-.526.14-.526.37v6.2c0 .232.197.37.525.37h14.95c.33 0 .525-.138.525-.37v-6.2c0-.23-.197-.37-.524-.37zm-.796.555l-6.81 3.795-6.693-3.795H87.68zm.27 5.83h-13.9c-.165 0-.263-.07-.263-.185v-5.17l7.082 3.967 7.34-4.113v5.316c0 .116-.098.186-.26.186z" fill="#010101"/></g></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 6.3 KiB

After

Width:  |  Height:  |  Size: 2 KiB

Before After
Before After

73
1-js/4-data-structures/6-object-reference/variable-copy-reference.svg
View file

@ -1,72 +1 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="501px" height="199px" viewBox="0 0 501 199" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
<!-- Generator: Sketch 3.2.2 (9983) - http://www.bohemiancoding.com/sketch -->
<title>Slice 1</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="variable-copy-reference" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
<path d="M43.5,141 L145.5,141" id="Line-2" stroke="#979797" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<path d="M1.5,197.5 L43.5,141.5" id="Line" stroke="#979797" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<path d="M132.5,196.5 L174.5,140.5" id="Line-3" stroke="#979797" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<path d="M43.5,101 L175.5,101" id="Line-7" stroke="#979797" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<path d="M1.5,157.5 L43.5,101.5" id="Line-8" stroke="#979797" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<path d="M132.5,157.5 L174.5,101.5" id="Line-9" stroke="#979797" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<path d="M43,141.5 L43,101.5" id="Line-4" stroke="#979797" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<rect id="Rectangle-2" stroke="#979797" stroke-width="2" fill="#E8E8E8" sketch:type="MSShapeGroup" transform="translate(81.959003, 132.776161) rotate(47.000000) translate(-81.959003, -132.776161) " x="42" y="120.247795" width="79.918006" height="25.0567324"></rect>
<path d="M175,140 L175,101.5" id="Line-5" stroke="#979797" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<rect id="Rectangle-4" stroke="#979797" stroke-width="2" fill="#FFFFFF" sketch:type="MSShapeGroup" x="0" y="158" width="133" height="40"></rect>
<g id="Rectangle-3-+-Oval-1-+-message" sketch:type="MSLayerGroup" transform="translate(37.000000, 171.000000)">
<rect id="Rectangle-3" stroke="#979797" fill="#FFFFFF" sketch:type="MSShapeGroup" x="0" y="0" width="63" height="16"></rect>
<circle id="Oval-1" stroke="#979797" sketch:type="MSShapeGroup" cx="3.5" cy="3.5" r="1.5"></circle>
<text id="user" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#4990E2">
<tspan x="15" y="12">user</tspan>
</text>
</g>
<g id="noun_3865-(1)" sketch:type="MSLayerGroup" transform="translate(185.000000, 0.000000)" fill="#000000">
<g id="Three_Stack_1_" sketch:type="MSShapeGroup">
<g id="Cabinet" transform="translate(0.200000, 0.033058)">
<path d="M107.53776,0.321282149 L4.06472,0.321282149 C2.02368,0.321282149 0.36952,0.908809745 0.36952,1.63375009 L0.36952,78.0088142 C0.36952,78.7337546 2.02368,79.3212821 4.06472,79.3212821 L107.53776,79.3212821 C109.5788,79.3212821 111.23296,78.7337546 111.23296,78.0088142 L111.23296,1.63375009 C111.23296,0.908809745 109.5788,0.321282149 107.53776,0.321282149 L107.53776,0.321282149 Z M101.5312,72.9669421 L10.0688,72.9669421 L10.0688,6.84756215 L101.5312,6.84756215 L101.5312,72.9669421 L101.5312,72.9669421 Z" id="Shape"></path>
</g>
<g id="Top_Handle" transform="translate(40.500000, 9.404959)">
<path d="M28.84488,0.0375813223 L25.08024,0.0375813223 L25.08024,5.56178132 C25.08024,5.99756132 24.53712,6.35072132 23.86752,6.35072132 L6.89192,6.35072132 C6.22232,6.35072132 5.6792,5.99756132 5.6792,5.56178132 L5.6792,0.0375813223 L2.1576,0.0375813223 C1.49048,0.0375813223 0.94984,0.387501322 0.94984,0.820041322 L0.94984,8.72402132 C0.94984,9.15656132 1.49048,9.50648132 2.1576,9.50648132 L28.84488,9.50648132 C29.512,9.50648132 30.05264,9.15656132 30.05264,8.72402132 L30.05264,0.820041322 C30.05264,0.387501322 29.50952,0.0375813223 28.84488,0.0375813223 L28.84488,0.0375813223 Z" id="Shape"></path>
</g>
</g>
</g>
<text id="name" sketch:type="MSTextLayer" font-family="Open Sans" font-size="14" font-weight="bold" fill="#979797">
<tspan x="218" y="49">name</tspan>
</text>
<g id="noun_37574_cc" sketch:type="MSLayerGroup" transform="translate(127.000000, 83.500000) rotate(10.000000) translate(-127.000000, -83.500000) translate(72.000000, 36.000000)" fill="#000000">
<g id="Editor" transform="translate(54.754715, 47.398639) rotate(141.000000) translate(-54.754715, -47.398639) translate(-4.796384, 34.631516)" sketch:type="MSShapeGroup">
<path d="M67.2636383,25.5342454 L67.2636383,17.7965953 C67.2636383,17.7965953 3.56264802,17.9173072 2.58917769,0 C34.7901854,16.5161804 67.2668582,10.8327102 67.2668582,10.8327102 L67.2636383,3.09506005 L116.972573,14.3146527 L67.2636383,25.5342454 L67.2636383,25.5342454 Z M72.5431368,22.3343418 L72.5431368,16.3282175 C72.5431368,16.3282175 23.6262507,17.435782 9.14303504,4.96543295 C35.1656667,17.435782 72.5431345,11.9892017 72.5431345,11.9892017 L72.5431368,6.09642199 L107.216377,14.3146527 L72.5431368,22.3343418 L72.5431368,22.3343418 Z" id="left_arrow" transform="translate(59.780875, 12.767123) scale(-1, 1) translate(-59.780875, -12.767123) "></path>
</g>
</g>
<g id="noun_4093_cc" sketch:type="MSLayerGroup" transform="translate(73.000000, 126.000000)" fill="#010101">
<path d="M15.47568,0 L0.52464,0 C0.19664,0 0,0.138870968 0,0.370322581 L0,6.57074194 C0,6.80208065 0.19664,6.94083871 0.52464,6.94083871 L15.47568,6.94083871 C15.80352,6.94083871 16,6.80208065 16,6.57074194 L16,0.370322581 C16,0.138870968 15.80336,0 15.47568,0 L15.47568,0 Z M14.67984,0.555370968 L7.86896,4.34959677 L1.17744,0.555370968 L14.67984,0.555370968 L14.67984,0.555370968 Z M14.95088,6.38558065 L1.04912,6.38558065 C0.88512,6.38558065 0.78688,6.31614516 0.78688,6.20030645 L0.78688,1.03125806 L7.86896,4.99743548 L15.21296,0.884483871 L15.21296,6.20030645 C15.21312,6.31614516 15.11488,6.38558065 14.95088,6.38558065 L14.95088,6.38558065 Z" id="Shape" sketch:type="MSShapeGroup"></path>
</g>
<path d="M367.5,141 L469.5,141" id="Line-16" stroke="#979797" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<path d="M325.5,197.5 L367.5,141.5" id="Line-6" stroke="#979797" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<path d="M456.5,196.5 L498.5,140.5" id="Line-10" stroke="#979797" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<path d="M367.5,101 L499.5,101" id="Line-11" stroke="#979797" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<path d="M325.5,157.5 L367.5,101.5" id="Line-12" stroke="#979797" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<path d="M456.5,157.5 L498.5,101.5" id="Line-13" stroke="#979797" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<path d="M367,141.5 L367,101.5" id="Line-14" stroke="#979797" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<rect id="Rectangle-5" stroke="#979797" stroke-width="2" fill="#E8E8E8" sketch:type="MSShapeGroup" transform="translate(405.959003, 132.776161) rotate(47.000000) translate(-405.959003, -132.776161) " x="366" y="120.247795" width="79.918006" height="25.0567324"></rect>
<path d="M499,140 L499,101.5" id="Line-15" stroke="#979797" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<rect id="Rectangle-6" stroke="#979797" stroke-width="2" fill="#FFFFFF" sketch:type="MSShapeGroup" x="324" y="158" width="133" height="40"></rect>
<g id="Rectangle-3-+-Oval-1-+-message-2" sketch:type="MSLayerGroup" transform="translate(361.000000, 171.000000)">
<rect id="Rectangle-3" stroke="#979797" fill="#FFFFFF" sketch:type="MSShapeGroup" x="0" y="0" width="63" height="16"></rect>
<circle id="Oval-1" stroke="#979797" sketch:type="MSShapeGroup" cx="3.5" cy="3.5" r="1.5"></circle>
<text id="admin" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#4990E2">
<tspan x="15" y="12">admin</tspan>
</text>
</g>
<g id="noun_37574_cc-2" sketch:type="MSLayerGroup" transform="translate(358.286167, 83.555879) scale(-1, 1) rotate(10.000000) translate(-358.286167, -83.555879) translate(303.786167, 35.555879)" fill="#000000">
<g id="Editor" transform="translate(54.526831, 47.793916) rotate(141.000000) translate(-54.526831, -47.793916) translate(-5.024268, 35.026793)" sketch:type="MSShapeGroup">
<path d="M67.2636383,25.5342454 L67.2636383,17.7965953 C67.2636383,17.7965953 3.56264802,17.9173072 2.58917769,0 C34.7901854,16.5161804 67.2668582,10.8327102 67.2668582,10.8327102 L67.2636383,3.09506005 L116.972573,14.3146527 L67.2636383,25.5342454 L67.2636383,25.5342454 Z M72.5431368,22.3343418 L72.5431368,16.3282175 C72.5431368,16.3282175 23.6262507,17.435782 9.14303504,4.96543295 C35.1656667,17.435782 72.5431345,11.9892017 72.5431345,11.9892017 L72.5431368,6.09642199 L107.216377,14.3146527 L72.5431368,22.3343418 L72.5431368,22.3343418 Z" id="left_arrow" transform="translate(59.780875, 12.767123) scale(-1, 1) translate(-59.780875, -12.767123) "></path>
</g>
</g>
<g id="noun_4093_cc-2" sketch:type="MSLayerGroup" transform="translate(397.000000, 126.000000)" fill="#010101">
<path d="M15.47568,0 L0.52464,0 C0.19664,0 0,0.138870968 0,0.370322581 L0,6.57074194 C0,6.80208065 0.19664,6.94083871 0.52464,6.94083871 L15.47568,6.94083871 C15.80352,6.94083871 16,6.80208065 16,6.57074194 L16,0.370322581 C16,0.138870968 15.80336,0 15.47568,0 L15.47568,0 Z M14.67984,0.555370968 L7.86896,4.34959677 L1.17744,0.555370968 L14.67984,0.555370968 L14.67984,0.555370968 Z M14.95088,6.38558065 L1.04912,6.38558065 C0.88512,6.38558065 0.78688,6.31614516 0.78688,6.20030645 L0.78688,1.03125806 L7.86896,4.99743548 L15.21296,0.884483871 L15.21296,6.20030645 C15.21312,6.31614516 15.11488,6.38558065 14.95088,6.38558065 L14.95088,6.38558065 Z" id="Shape" sketch:type="MSShapeGroup"></path>
</g>
</g>
</svg>
<svg width="501" height="199" viewBox="0 0 501 199" xmlns="http://www.w3.org/2000/svg"><title>Slice 1</title><desc>Created with Sketch.</desc><g fill="none" fill-rule="evenodd"><path d="M43.5 141h102m-144 56.5l42-56m89 55l42-56M43.5 101h132m-174 56.5l42-56m89 56l42-56M43 141.5v-40" stroke="#979797" stroke-width="2" stroke-linecap="square"/><path stroke="#979797" stroke-width="2" fill="#E8E8E8" d="M63.865 95.022l54.504 58.42-18.32 17.09-54.505-58.42z"/><path d="M175 140v-38.5" stroke="#979797" stroke-width="2" stroke-linecap="square"/><path stroke="#979797" stroke-width="2" fill="#fff" d="M0 158h133v40H0z"/><g transform="translate(37 171)"><path stroke="#979797" fill="#fff" d="M0 0h63v16H0z"/><circle stroke="#979797" cx="3.5" cy="3.5" r="1.5"/><text font-family="Consolas" font-size="14" fill="#4990E2"><tspan x="15" y="12">user</tspan></text></g><path d="M292.738.354H189.265c-2.04 0-3.695.588-3.695 1.313v76.375c0 .725 1.654 1.312 3.695 1.312h103.473c2.04 0 3.695-.587 3.695-1.312V1.667c0-.725-1.654-1.313-3.695-1.313zM286.73 73h-91.46V6.88h91.46V73zM254.345 9.443h-3.765v5.524c0 .436-.543.79-1.212.79h-16.976c-.67 0-1.213-.354-1.213-.79V9.443h-3.525c-.668 0-1.208.35-1.208.782v7.904c0 .43.54.78 1.207.78h26.687c.668 0 1.21-.35 1.21-.78V10.22c0-.432-.544-.782-1.21-.782z" fill="#000"/><text font-family="Open Sans" font-size="14" font-weight="bold" fill="#979797"><tspan x="218" y="49">name</tspan></text><path d="M126.932 68.668l3.752 6.77s-55.797 30.79-47.958 46.94c20.165-30.07 51.34-40.848 51.34-40.848l3.75 6.772 38.052-33.926-48.936 14.292zm6.17.24l2.914 5.254s-43.34 22.756-49.964 40.692C102.774 91.32 138.12 77.96 138.12 77.96l2.858 5.155 26.354-24.007-34.23 9.8z" fill="#000"/><path d="M88.476 126h-14.95c-.33 0-.526.14-.526.37v6.2c0 .232.197.37.525.37h14.95c.33 0 .525-.138.525-.37v-6.2c0-.23-.197-.37-.524-.37zm-.796.555l-6.81 3.795-6.693-3.795H87.68zm.27 5.83h-13.9c-.165 0-.263-.07-.263-.185v-5.17l7.082 3.967 7.34-4.113v5.316c0 .116-.098.186-.26.186z" fill="#010101"/><path d="M367.5 141h102m-144 56.5l42-56m89 55l42-56m-131-39.5h132m-174 56.5l42-56m89 56l42-56m-131.5 40v-40" stroke="#979797" stroke-width="2" stroke-linecap="square"/><path stroke="#979797" stroke-width="2" fill="#E8E8E8" d="M387.865 95.022l54.504 58.42-18.32 17.09-54.505-58.42z"/><path d="M499 140v-38.5" stroke="#979797" stroke-width="2" stroke-linecap="square"/><path stroke="#979797" stroke-width="2" fill="#fff" d="M324 158h133v40H324z"/><g transform="translate(361 171)"><path stroke="#979797" fill="#fff" d="M0 0h63v16H0z"/><circle stroke="#979797" cx="3.5" cy="3.5" r="1.5"/><text font-family="Consolas" font-size="14" fill="#4990E2"><tspan x="15" y="12">admin</tspan></text></g><path d="M358.068 68.67l-3.752 6.77s55.797 30.788 47.958 46.938c-20.165-30.07-51.34-40.847-51.34-40.847l-3.75 6.776-38.052-33.926 48.936 14.29zm-6.17.238l-2.914 5.255s43.34 22.756 49.964 40.692C382.226 91.322 346.88 77.96 346.88 77.96l-2.858 5.156-26.354-24.007 34.23 9.795z" fill="#000"/><path d="M412.476 126h-14.95c-.33 0-.526.14-.526.37v6.2c0 .232.197.37.525.37h14.95c.33 0 .525-.138.525-.37v-6.2c0-.23-.197-.37-.524-.37zm-.796.555l-6.81 3.795-6.693-3.795h13.503zm.27 5.83h-13.9c-.165 0-.263-.07-.263-.185v-5.17l7.082 3.967 7.34-4.113v5.316c0 .116-.098.186-.26.186z" fill="#010101"/></g></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 10 KiB

After

Width:  |  Height:  |  Size: 3.2 KiB

Before After
Before After

50
1-js/4-data-structures/6-object-reference/variable-copy-value.svg
View file

@ -1,49 +1 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="366px" height="103px" viewBox="0 0 366 103" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
<!-- Generator: Sketch 3.2.2 (9983) - http://www.bohemiancoding.com/sketch -->
<title>Diagrams</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="variable-copy-value" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
<path d="M43.5,45 L145.5,45" id="Line-2" stroke="#979797" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<path d="M1.5,101.5 L43.5,45.5" id="Line" stroke="#979797" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<path d="M132.5,100.5 L174.5,44.5" id="Line-3" stroke="#979797" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<path d="M43.5,5 L175.5,5" id="Line-7" stroke="#979797" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<path d="M1.5,61.5 L43.5,5.5" id="Line-8" stroke="#979797" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<path d="M132.5,61.5 L174.5,5.5" id="Line-9" stroke="#979797" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<path d="M43,45.5 L43,5.5" id="Line-4" stroke="#979797" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<rect id="Rectangle-2" stroke="#979797" stroke-width="2" fill="#E8E8E8" sketch:type="MSShapeGroup" transform="translate(81.959003, 36.776161) rotate(47.000000) translate(-81.959003, -36.776161) " x="42" y="24.247795" width="79.918006" height="25.0567324"></rect>
<text id="&quot;Привет&quot;" sketch:type="MSTextLayer" transform="translate(85.693270, 38.500000) rotate(47.000000) translate(-85.693270, -38.500000) " font-family="Open Sans" font-size="14" font-weight="normal" fill="#373535">
<tspan x="54.6932699" y="44">"Привет"</tspan>
</text>
<path d="M175,44 L175,5.5" id="Line-5" stroke="#979797" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<rect id="Rectangle-4" stroke="#979797" stroke-width="2" fill="#FFFFFF" sketch:type="MSShapeGroup" x="0" y="62" width="133" height="40"></rect>
<g id="Rectangle-3-+-Oval-1-+-message" sketch:type="MSLayerGroup" transform="translate(37.000000, 75.000000)">
<rect id="Rectangle-3" stroke="#979797" fill="#FFFFFF" sketch:type="MSShapeGroup" x="0" y="0" width="63" height="16"></rect>
<circle id="Oval-1" stroke="#979797" sketch:type="MSShapeGroup" cx="3.5" cy="3.5" r="1.5"></circle>
<text id="message" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#4990E2">
<tspan x="7" y="12">message</tspan>
</text>
</g>
<path d="M232.5,45 L334.5,45" id="Line-6" stroke="#979797" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<path d="M190.5,101.5 L232.5,45.5" id="Line-10" stroke="#979797" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<path d="M321.5,100.5 L363.5,44.5" id="Line-11" stroke="#979797" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<path d="M232.5,5 L364.5,5" id="Line-12" stroke="#979797" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<path d="M190.5,61.5 L232.5,5.5" id="Line-13" stroke="#979797" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<path d="M321.5,61.5 L363.5,5.5" id="Line-14" stroke="#979797" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<path d="M232,45.5 L232,5.5" id="Line-15" stroke="#979797" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<rect id="Rectangle-5" stroke="#979797" stroke-width="2" fill="#E8E8E8" sketch:type="MSShapeGroup" transform="translate(270.959003, 36.776161) rotate(47.000000) translate(-270.959003, -36.776161) " x="231" y="24.247795" width="79.918006" height="25.0567324"></rect>
<text id="&quot;Привет&quot;" sketch:type="MSTextLayer" transform="translate(274.693270, 38.500000) rotate(47.000000) translate(-274.693270, -38.500000) " font-family="Open Sans" font-size="14" font-weight="normal" fill="#373535">
<tspan x="243.69327" y="44">"Привет"</tspan>
</text>
<path d="M364,44 L364,5.5" id="Line-16" stroke="#979797" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<rect id="Rectangle-6" stroke="#979797" stroke-width="2" fill="#FFFFFF" sketch:type="MSShapeGroup" x="189" y="62" width="133" height="40"></rect>
<g id="Rectangle-3-+-Oval-1-+-message-2" sketch:type="MSLayerGroup" transform="translate(226.000000, 75.000000)">
<rect id="Rectangle-3" stroke="#979797" fill="#FFFFFF" sketch:type="MSShapeGroup" x="0" y="0" width="63" height="16"></rect>
<circle id="Oval-1" stroke="#979797" sketch:type="MSShapeGroup" cx="3.5" cy="3.5" r="1.5"></circle>
<text id="phrase" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#4990E2">
<tspan x="10" y="12">phrase</tspan>
</text>
</g>
</g>
</svg>
<svg width="366" height="103" viewBox="0 0 366 103" xmlns="http://www.w3.org/2000/svg"><title>Diagrams</title><desc>Created with Sketch.</desc><g fill="none" fill-rule="evenodd"><path d="M43.5 45h102m-144 56.5l42-56m89 55l42-56M43.5 5h132M1.5 61.5l42-56m89 56l42-56M43 45.5v-40" stroke="#979797" stroke-width="2" stroke-linecap="square"/><path stroke="#979797" stroke-width="2" fill="#E8E8E8" d="M63.865-.978l54.504 58.42-18.32 17.09-54.505-58.42z"/><text transform="rotate(47 85.693 38.5)" font-family="Open Sans" font-size="14" fill="#373535"><tspan x="54.693" y="44">&amp;quot;Привет&amp;quot;</tspan></text><path d="M175 44V5.5" stroke="#979797" stroke-width="2" stroke-linecap="square"/><path stroke="#979797" stroke-width="2" fill="#fff" d="M0 62h133v40H0z"/><g transform="translate(37 75)"><path stroke="#979797" fill="#fff" d="M0 0h63v16H0z"/><circle stroke="#979797" cx="3.5" cy="3.5" r="1.5"/><text font-family="Consolas" font-size="14" fill="#4990E2"><tspan x="7" y="12">message</tspan></text></g><path d="M232.5 45h102m-144 56.5l42-56m89 55l42-56M232.5 5h132m-174 56.5l42-56m89 56l42-56M232 45.5v-40" stroke="#979797" stroke-width="2" stroke-linecap="square"/><path stroke="#979797" stroke-width="2" fill="#E8E8E8" d="M252.865-.978l54.504 58.42-18.32 17.09-54.505-58.42z"/><text transform="rotate(47 274.693 38.5)" font-family="Open Sans" font-size="14" fill="#373535"><tspan x="243.693" y="44">&amp;quot;Привет&amp;quot;</tspan></text><path d="M364 44V5.5" stroke="#979797" stroke-width="2" stroke-linecap="square"/><path stroke="#979797" stroke-width="2" fill="#fff" d="M189 62h133v40H189z"/><g transform="translate(226 75)"><path stroke="#979797" fill="#fff" d="M0 0h63v16H0z"/><circle stroke="#979797" cx="3.5" cy="3.5" r="1.5"/><text font-family="Consolas" font-size="14" fill="#4990E2"><tspan x="10" y="12">phrase</tspan></text></g></g></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 5.4 KiB

After

Width:  |  Height:  |  Size: 1.8 KiB

Before After
Before After

69
1-js/4-data-structures/7-array/array-pop.svg
View file

@ -1,68 +1 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="329px" height="158px" viewBox="0 0 329 158" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
<!-- Generator: Sketch 3.2.2 (9983) - http://www.bohemiancoding.com/sketch -->
<title>Slice 1</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="array-pop" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
<rect id="Rectangle-1" stroke="#9B9B9B" sketch:type="MSShapeGroup" x="0" y="79" width="37" height="54"></rect>
<rect id="Rectangle-2" stroke="#9B9B9B" sketch:type="MSShapeGroup" x="36" y="79" width="37" height="54"></rect>
<text id="0" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="15" y="110">0</tspan>
</text>
<text id="1" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="52" y="110">1</tspan>
</text>
<rect id="Rectangle-3" stroke="#9B9B9B" sketch:type="MSShapeGroup" x="72" y="79" width="37" height="54"></rect>
<text id="2" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="88" y="110">2</tspan>
</text>
<rect id="Rectangle-4" stroke="#9B9B9B" sketch:type="MSShapeGroup" x="108" y="79" width="37" height="54"></rect>
<text id="3" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#4990E2">
<tspan x="124" y="110">3</tspan>
</text>
<text id="&quot;Яблоко&quot;" sketch:type="MSTextLayer" transform="translate(18.960194, 45.000000) rotate(-89.000000) translate(-18.960194, -45.000000) " font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="-12.0398062" y="47">"Яблоко"</tspan>
</text>
<text id="&quot;Апельсин&quot;" sketch:type="MSTextLayer" transform="translate(59.460194, 38.000000) rotate(-89.000000) translate(-59.460194, -38.000000) " font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="20.9601938" y="40">"Апельсин"</tspan>
</text>
<text id="&quot;Груша&quot;" sketch:type="MSTextLayer" transform="translate(92.000000, 50.000000) rotate(-89.000000) translate(-92.000000, -50.000000) " font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="65" y="52">"Груша"</tspan>
</text>
<text id="&quot;Лимон&quot;" sketch:type="MSTextLayer" transform="translate(129.960194, 49.000000) rotate(-89.000000) translate(-129.960194, -49.000000) " font-family="Consolas" font-size="14" font-weight="normal" fill="#4990E2">
<tspan x="102.960194" y="51">"Лимон"</tspan>
</text>
<text id="length-=-4" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="0" y="155">length = 4</tspan>
</text>
<path d="M183.5,135.5 L192.5,118.893834 L186.5,118.893834 L186.5,76.5 L180.5,76.5 L180.5,118.893834 L174.5,118.893834 L183.5,135.5 Z" id="Shape" fill="#000000" sketch:type="MSShapeGroup" transform="translate(183.500000, 106.000000) rotate(-90.000000) translate(-183.500000, -106.000000) "></path>
<text id="очистить" sketch:type="MSTextLayer" font-family="Open Sans" font-size="14" font-weight="normal" fill="#4990E2">
<tspan x="150" y="95">очистить</tspan>
</text>
<rect id="Rectangle-7" stroke="#9B9B9B" sketch:type="MSShapeGroup" x="220" y="79" width="37" height="54"></rect>
<rect id="Rectangle-5" stroke="#9B9B9B" sketch:type="MSShapeGroup" x="256" y="79" width="37" height="54"></rect>
<text id="-1" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="235" y="110">0</tspan>
</text>
<text id="-2" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="272" y="110">1</tspan>
</text>
<rect id="Rectangle-6" stroke="#9B9B9B" sketch:type="MSShapeGroup" x="292" y="79" width="37" height="54"></rect>
<text id="-3" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="308" y="110">2</tspan>
</text>
<text id="&quot;Яблоко&quot;-2" sketch:type="MSTextLayer" transform="translate(238.960194, 45.000000) rotate(-89.000000) translate(-238.960194, -45.000000) " font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="207.960194" y="47">"Яблоко"</tspan>
</text>
<text id="&quot;Апельсин&quot;-2" sketch:type="MSTextLayer" transform="translate(279.460194, 38.000000) rotate(-89.000000) translate(-279.460194, -38.000000) " font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="240.960194" y="40">"Апельсин"</tspan>
</text>
<text id="&quot;Груша&quot;-2" sketch:type="MSTextLayer" transform="translate(312.000000, 50.000000) rotate(-89.000000) translate(-312.000000, -50.000000) " font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="285" y="52">"Груша"</tspan>
</text>
<text id="length-=-3" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="220" y="155">length = 3</tspan>
</text>
</g>
</svg>
<svg width="329" height="158" viewBox="0 0 329 158" xmlns="http://www.w3.org/2000/svg"><title>Slice 1</title><desc>Created with Sketch.</desc><g fill="none" fill-rule="evenodd"><path stroke="#9B9B9B" d="M0 79h37v54H0zm36 0h37v54H36z"/><text font-family="Consolas" font-size="14" fill="#000"><tspan x="15" y="110">0</tspan></text><text font-family="Consolas" font-size="14" fill="#000"><tspan x="52" y="110">1</tspan></text><path stroke="#9B9B9B" d="M72 79h37v54H72z"/><text font-family="Consolas" font-size="14" fill="#000"><tspan x="88" y="110">2</tspan></text><path stroke="#9B9B9B" d="M108 79h37v54h-37z"/><text font-family="Consolas" font-size="14" fill="#4990E2"><tspan x="124" y="110">3</tspan></text><text transform="rotate(-89 18.96 45)" font-family="Consolas" font-size="14" fill="#000"><tspan x="-12.04" y="47">&amp;quot;Яблоко&amp;quot;</tspan></text><text transform="rotate(-89 59.46 38)" font-family="Consolas" font-size="14" fill="#000"><tspan x="20.96" y="40">&amp;quot;Апельсин&amp;quot;</tspan></text><text transform="rotate(-89 92 50)" font-family="Consolas" font-size="14" fill="#000"><tspan x="65" y="52">&amp;quot;Груша&amp;quot;</tspan></text><text transform="rotate(-89 129.96 49)" font-family="Consolas" font-size="14" fill="#4990E2"><tspan x="102.96" y="51">&amp;quot;Лимон&amp;quot;</tspan></text><text font-family="Consolas" font-size="14" fill="#000"><tspan x="0" y="155">length = 4</tspan></text><path d="M213 106l-16.606-9v6H154v6h42.394v6L213 106z" fill="#000"/><text font-family="Open Sans" font-size="14" fill="#4990E2"><tspan x="150" y="95">очистить</tspan></text><path stroke="#9B9B9B" d="M220 79h37v54h-37zm36 0h37v54h-37z"/><text font-family="Consolas" font-size="14" fill="#000"><tspan x="235" y="110">0</tspan></text><text font-family="Consolas" font-size="14" fill="#000"><tspan x="272" y="110">1</tspan></text><path stroke="#9B9B9B" d="M292 79h37v54h-37z"/><text font-family="Consolas" font-size="14" fill="#000"><tspan x="308" y="110">2</tspan></text><text transform="rotate(-89 238.96 45)" font-family="Consolas" font-size="14" fill="#000"><tspan x="207.96" y="47">&amp;quot;Яблоко&amp;quot;</tspan></text><text transform="rotate(-89 279.46 38)" font-family="Consolas" font-size="14" fill="#000"><tspan x="240.96" y="40">&amp;quot;Апельсин&amp;quot;</tspan></text><text transform="rotate(-89 312 50)" font-family="Consolas" font-size="14" fill="#000"><tspan x="285" y="52">&amp;quot;Груша&amp;quot;</tspan></text><text font-family="Consolas" font-size="14" fill="#000"><tspan x="220" y="155">length = 3</tspan></text></g></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 5.7 KiB

After

Width:  |  Height:  |  Size: 2.6 KiB

Before After
Before After

105
1-js/4-data-structures/7-array/array-shift.svg
View file

@ -1,104 +1 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="593px" height="158px" viewBox="0 0 593 158" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
<!-- Generator: Sketch 3.2.2 (9983) - http://www.bohemiancoding.com/sketch -->
<title>Slice 1</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="array-shift" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
<rect id="Rectangle-1" stroke="#9B9B9B" sketch:type="MSShapeGroup" x="0" y="79" width="37" height="54"></rect>
<rect id="Rectangle-2" stroke="#9B9B9B" sketch:type="MSShapeGroup" x="36" y="79" width="37" height="54"></rect>
<text id="0" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#4990E2">
<tspan x="15" y="110">0</tspan>
</text>
<text id="1" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="52" y="110">1</tspan>
</text>
<rect id="Rectangle-3" stroke="#9B9B9B" sketch:type="MSShapeGroup" x="72" y="79" width="37" height="54"></rect>
<text id="2" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="88" y="110">2</tspan>
</text>
<rect id="Rectangle-4" stroke="#9B9B9B" sketch:type="MSShapeGroup" x="108" y="79" width="37" height="54"></rect>
<text id="3" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="124" y="110">3</tspan>
</text>
<text id="&quot;Яблоко&quot;" sketch:type="MSTextLayer" transform="translate(18.960194, 45.000000) rotate(-89.000000) translate(-18.960194, -45.000000) " font-family="Consolas" font-size="14" font-weight="normal" fill="#4990E2">
<tspan x="-12.0398062" y="47">"Яблоко"</tspan>
</text>
<text id="&quot;Апельсин&quot;" sketch:type="MSTextLayer" transform="translate(59.460194, 38.000000) rotate(-89.000000) translate(-59.460194, -38.000000) " font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="20.9601938" y="40">"Апельсин"</tspan>
</text>
<text id="&quot;Груша&quot;" sketch:type="MSTextLayer" transform="translate(92.000000, 50.000000) rotate(-89.000000) translate(-92.000000, -50.000000) " font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="65" y="52">"Груша"</tspan>
</text>
<text id="&quot;Лимон&quot;" sketch:type="MSTextLayer" transform="translate(129.960194, 49.000000) rotate(-89.000000) translate(-129.960194, -49.000000) " font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="102.960194" y="51">"Лимон"</tspan>
</text>
<text id="length-=-4" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="0" y="155">length = 4</tspan>
</text>
<rect id="Rectangle-8" stroke="#9B9B9B" sketch:type="MSShapeGroup" x="218" y="79" width="37" height="54"></rect>
<rect id="Rectangle-5" stroke="#9B9B9B" sketch:type="MSShapeGroup" x="254" y="79" width="37" height="54"></rect>
<text id="-1" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#4990E2">
<tspan x="233" y="110">0</tspan>
</text>
<text id="-2" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="270" y="110">1</tspan>
</text>
<rect id="Rectangle-6" stroke="#9B9B9B" sketch:type="MSShapeGroup" x="290" y="79" width="37" height="54"></rect>
<text id="-3" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="306" y="110">2</tspan>
</text>
<rect id="Rectangle-7" stroke="#9B9B9B" sketch:type="MSShapeGroup" x="326" y="79" width="37" height="54"></rect>
<text id="-4" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="342" y="110">3</tspan>
</text>
<text id="&quot;Апельсин&quot;-2" sketch:type="MSTextLayer" transform="translate(277.460194, 38.000000) rotate(-89.000000) translate(-277.460194, -38.000000) " font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="238.960194" y="40">"Апельсин"</tspan>
</text>
<text id="&quot;Груша&quot;-2" sketch:type="MSTextLayer" transform="translate(310.000000, 50.000000) rotate(-89.000000) translate(-310.000000, -50.000000) " font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="283" y="52">"Груша"</tspan>
</text>
<text id="&quot;Лимон&quot;-2" sketch:type="MSTextLayer" transform="translate(347.960194, 49.000000) rotate(-89.000000) translate(-347.960194, -49.000000) " font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="320.960194" y="51">"Лимон"</tspan>
</text>
<text id="length-=-5" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="218" y="155">length = 4</tspan>
</text>
<path d="M183.5,135.5 L192.5,118.893834 L186.5,118.893834 L186.5,76.5 L180.5,76.5 L180.5,118.893834 L174.5,118.893834 L183.5,135.5 Z" id="Shape" fill="#000000" sketch:type="MSShapeGroup" transform="translate(183.500000, 106.000000) rotate(-90.000000) translate(-183.500000, -106.000000) "></path>
<text id="очистить" sketch:type="MSTextLayer" font-family="Open Sans" font-size="14" font-weight="normal" fill="#4990E2">
<tspan x="150" y="95">очистить</tspan>
</text>
<rect id="Rectangle-12" stroke="#9B9B9B" sketch:type="MSShapeGroup" x="484" y="79" width="37" height="54"></rect>
<rect id="Rectangle-9" stroke="#9B9B9B" sketch:type="MSShapeGroup" x="520" y="79" width="37" height="54"></rect>
<text id="-5" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="499" y="110">0</tspan>
</text>
<text id="-6" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="536" y="110">1</tspan>
</text>
<rect id="Rectangle-10" stroke="#9B9B9B" sketch:type="MSShapeGroup" x="556" y="79" width="37" height="54"></rect>
<text id="-7" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="572" y="110">2</tspan>
</text>
<text id="&quot;Апельсин&quot;-3" sketch:type="MSTextLayer" transform="translate(505.460194, 38.000000) rotate(-89.000000) translate(-505.460194, -38.000000) " font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="466.960194" y="40">"Апельсин"</tspan>
</text>
<text id="&quot;Груша&quot;-3" sketch:type="MSTextLayer" transform="translate(538.000000, 50.000000) rotate(-89.000000) translate(-538.000000, -50.000000) " font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="511" y="52">"Груша"</tspan>
</text>
<text id="&quot;Лимон&quot;-3" sketch:type="MSTextLayer" transform="translate(575.960194, 49.000000) rotate(-89.000000) translate(-575.960194, -49.000000) " font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="548.960194" y="51">"Лимон"</tspan>
</text>
<text id="length-=-3" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal">
<tspan x="484" y="155" fill="#000000">length = </tspan>
<tspan x="553.275391" y="155" fill="#4990E2">3</tspan>
</text>
<path d="M425.727051,151.272949 L434.727051,134.666783 L428.727051,134.666783 L428.727051,62.7270508 L422.169922,62.7270508 L422.727051,134.666783 L416.727051,134.666783 L425.727051,151.272949 Z" id="Shape-2" fill="#000000" sketch:type="MSShapeGroup" transform="translate(425.727051, 107.000000) rotate(-90.000000) translate(-425.727051, -107.000000) "></path>
<text id="переместить" sketch:type="MSTextLayer" font-family="Open Sans" font-size="14" font-weight="normal" fill="#4990E2">
<tspan x="382" y="93">переместить</tspan>
<tspan x="382" y="112"></tspan>
<tspan x="382" y="131">элементы</tspan>
<tspan x="382" y="150">влево</tspan>
</text>
</g>
</svg>
<svg width="593" height="158" viewBox="0 0 593 158" xmlns="http://www.w3.org/2000/svg"><title>Slice 1</title><desc>Created with Sketch.</desc><g fill="none" fill-rule="evenodd"><path stroke="#9B9B9B" d="M0 79h37v54H0zm36 0h37v54H36z"/><text font-family="Consolas" font-size="14" fill="#4990E2"><tspan x="15" y="110">0</tspan></text><text font-family="Consolas" font-size="14" fill="#000"><tspan x="52" y="110">1</tspan></text><path stroke="#9B9B9B" d="M72 79h37v54H72z"/><text font-family="Consolas" font-size="14" fill="#000"><tspan x="88" y="110">2</tspan></text><path stroke="#9B9B9B" d="M108 79h37v54h-37z"/><text font-family="Consolas" font-size="14" fill="#000"><tspan x="124" y="110">3</tspan></text><text transform="rotate(-89 18.96 45)" font-family="Consolas" font-size="14" fill="#4990E2"><tspan x="-12.04" y="47">&amp;quot;Яблоко&amp;quot;</tspan></text><text transform="rotate(-89 59.46 38)" font-family="Consolas" font-size="14" fill="#000"><tspan x="20.96" y="40">&amp;quot;Апельсин&amp;quot;</tspan></text><text transform="rotate(-89 92 50)" font-family="Consolas" font-size="14" fill="#000"><tspan x="65" y="52">&amp;quot;Груша&amp;quot;</tspan></text><text transform="rotate(-89 129.96 49)" font-family="Consolas" font-size="14" fill="#000"><tspan x="102.96" y="51">&amp;quot;Лимон&amp;quot;</tspan></text><text font-family="Consolas" font-size="14" fill="#000"><tspan x="0" y="155">length = 4</tspan></text><path stroke="#9B9B9B" d="M218 79h37v54h-37zm36 0h37v54h-37z"/><text font-family="Consolas" font-size="14" fill="#4990E2"><tspan x="233" y="110">0</tspan></text><text font-family="Consolas" font-size="14" fill="#000"><tspan x="270" y="110">1</tspan></text><path stroke="#9B9B9B" d="M290 79h37v54h-37z"/><text font-family="Consolas" font-size="14" fill="#000"><tspan x="306" y="110">2</tspan></text><path stroke="#9B9B9B" d="M326 79h37v54h-37z"/><text font-family="Consolas" font-size="14" fill="#000"><tspan x="342" y="110">3</tspan></text><text transform="rotate(-89 277.46 38)" font-family="Consolas" font-size="14" fill="#000"><tspan x="238.96" y="40">&amp;quot;Апельсин&amp;quot;</tspan></text><text transform="rotate(-89 310 50)" font-family="Consolas" font-size="14" fill="#000"><tspan x="283" y="52">&amp;quot;Груша&amp;quot;</tspan></text><text transform="rotate(-89 347.96 49)" font-family="Consolas" font-size="14" fill="#000"><tspan x="320.96" y="51">&amp;quot;Лимон&amp;quot;</tspan></text><text font-family="Consolas" font-size="14" fill="#000"><tspan x="218" y="155">length = 4</tspan></text><path d="M213 106l-16.606-9v6H154v6h42.394v6L213 106z" fill="#000"/><text font-family="Open Sans" font-size="14" fill="#4990E2"><tspan x="150" y="95">очистить</tspan></text><path stroke="#9B9B9B" d="M484 79h37v54h-37zm36 0h37v54h-37z"/><text font-family="Consolas" font-size="14" fill="#000"><tspan x="499" y="110">0</tspan></text><text font-family="Consolas" font-size="14" fill="#000"><tspan x="536" y="110">1</tspan></text><path stroke="#9B9B9B" d="M556 79h37v54h-37z"/><text font-family="Consolas" font-size="14" fill="#000"><tspan x="572" y="110">2</tspan></text><text transform="rotate(-89 505.46 38)" font-family="Consolas" font-size="14" fill="#000"><tspan x="466.96" y="40">&amp;quot;Апельсин&amp;quot;</tspan></text><text transform="rotate(-89 538 50)" font-family="Consolas" font-size="14" fill="#000"><tspan x="511" y="52">&amp;quot;Груша&amp;quot;</tspan></text><text transform="rotate(-89 575.96 49)" font-family="Consolas" font-size="14" fill="#000"><tspan x="548.96" y="51">&amp;quot;Лимон&amp;quot;</tspan></text><text font-family="Consolas" font-size="14"><tspan x="484" y="155">length =</tspan><tspan x="553.275" y="155" fill="#4990E2">3</tspan></text><path d="M470 107l-16.606-9v6h-71.94v6.557l71.94-.557v6L470 107z" fill="#000"/><text font-family="Open Sans" font-size="14" fill="#4990E2"><tspan x="382" y="93">переместить</tspan><tspan x="382" y="131">элементы</tspan><tspan x="382" y="150">влево</tspan></text></g></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 8.9 KiB

After

Width:  |  Height:  |  Size: 4 KiB

Before After
Before After

60
1-js/4-data-structures/7-array/array-speed.svg
View file

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

Before

Width:  |  Height:  |  Size: 26 KiB

After

Width:  |  Height:  |  Size: 16 KiB

Before After
Before After

20
1-js/4-data-structures/7-array/queue.svg
View file

@ -1,19 +1 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="168px" height="93px" viewBox="0 0 168 93" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
<!-- Generator: Sketch 3.2.2 (9983) - http://www.bohemiancoding.com/sketch -->
<title>Slice 1</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="queue" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
<g id="noun_21323_cc" sketch:type="MSLayerGroup" transform="translate(51.000000, 0.000000)" fill="#000000">
<g id="Group" sketch:type="MSShapeGroup">
<path d="M31.795,34.15 C30.575,34.15 29.455,33.343 29.111,32.11 C28.696,30.626 29.563,29.088 31.047,28.674 L53.439,22.421 C54.922,22.006 56.46,22.874 56.876,24.357 C57.29,25.841 56.423,27.379 54.939,27.793 L32.547,34.046 C32.296,34.117 32.043,34.15 31.795,34.15 L31.795,34.15 Z" id="Shape"></path>
<path d="M31.795,45.188 C30.575,45.188 29.455,44.381 29.111,43.148 C28.696,41.664 29.563,40.126 31.047,39.712 L53.439,33.459 C54.922,33.045 56.46,33.912 56.876,35.395 C57.29,36.879 56.423,38.417 54.939,38.831 L32.547,45.084 C32.296,45.155 32.043,45.188 31.795,45.188 L31.795,45.188 Z" id="Shape"></path>
<path d="M31.795,55.557 C30.575,55.557 29.455,54.75 29.111,53.517 C28.696,52.034 29.563,50.496 31.047,50.081 L53.439,43.828 C54.922,43.414 56.46,44.281 56.876,45.764 C57.29,47.248 56.423,48.786 54.939,49.2 L32.547,55.453 C32.296,55.523 32.043,55.557 31.795,55.557 L31.795,55.557 Z" id="Shape"></path>
<path d="M55.837,8.439 L55.837,6.655 C55.837,3.042 52.816,-0.669 49.286,0.104 C39.874,2.164 18.568,9.063 7.433,11.457 C3.902,12.216 0.881,15.193 0.881,18.806 L0.881,79.758 C0.881,83.371 3.857,86.819 7.433,86.31 C9.432,86.026 11.7,85.563 14.161,84.97 L14.161,86.398 C14.161,90.011 17.136,93.459 20.712,92.95 C24.888,92.356 47.3919992,85.5499983 53.1949992,83.8389983 L53.1949992,78.4649977 C47.6279992,80.1029977 25.161,86.773 20.712,87.814 C19.951,87.993 19.296,87.179 19.296,86.398 L19.296,26.74 C19.218,24.948 19.915,23.453 22.011,22.893 C28.081,21.27 43.963,16.948 53.955,14.225 L55.836,13.713 C59.871,12.613 62.564,11.879 62.564,11.879 C63.345,11.879 63.98,12.514 63.98,13.295 L63.98,74.248 C63.98,75.029 63.315,75.451 62.564,75.664 C59.968,76.402 56.744,77.377 53.182,78.465 L53.195,83.839 C56.6,82.72 59.797,81.669 62.564,80.8 C66.01,79.717 69.116,78.431 69.116,74.248 L69.116,13.294 C69.117,9.682 66.095,5.97 62.565,6.743 C60.724,7.146 58.423,7.736 55.837,8.439 Z M20.713,18.096 C17.182,18.856 14.162,21.833 14.162,25.445 L14.162,79.46 C11.772,80.108 9.511,80.689 7.434,81.175 C6.673,81.353 6.018,80.539 6.018,79.758 L6.018,20.1 C5.94,18.308 6.637,16.813 8.733,16.253 C17.876,13.81 49.287,5.239 49.287,5.239 C50.068,5.239 50.703,5.874 50.703,6.655 L50.703,9.872 C40.644,12.732 28.312,16.462 20.713,18.096 L20.713,18.096 Z" id="Shape"></path>
</g>
</g>
<path d="M146.682617,63.3173828 L158.682617,51.3173828 L150.682617,51.3173828 L150.682617,20.6826172 L142.682617,20.6826172 L142.682617,51.3173828 L134.682617,51.3173828 L146.682617,63.3173828 Z" id="Shape" fill="#000000" sketch:type="MSShapeGroup" transform="translate(146.682617, 42.000000) rotate(-90.000000) translate(-146.682617, -42.000000) "></path>
<path d="M21.6826172,63.3173828 L33.6826172,51.3173828 L25.6826172,51.3173828 L25.6826172,20.6826172 L17.6826172,20.6826172 L17.6826172,51.3173828 L9.68261719,51.3173828 L21.6826172,63.3173828 Z" id="Shape-2" fill="#000000" sketch:type="MSShapeGroup" transform="translate(21.682617, 42.000000) rotate(-90.000000) translate(-21.682617, -42.000000) "></path>
</g>
</svg>
<svg width="168" height="93" viewBox="0 0 168 93" xmlns="http://www.w3.org/2000/svg"><title>Slice 1</title><desc>Created with Sketch.</desc><path d="M82.795 34.15c-1.22 0-2.34-.807-2.684-2.04-.41-1.484.456-3.022 1.94-3.436l22.39-6.253c1.484-.41 3.02.457 3.438 1.94.414 1.484-.453 3.02-1.937 3.436L83.548 34.05c-.25.07-.504.103-.752.103zm0 11.038c-1.22 0-2.34-.807-2.684-2.04-.41-1.484.456-3.022 1.94-3.436l22.39-6.253c1.484-.418 3.02.45 3.438 1.932.414 1.484-.453 3.022-1.937 3.436L83.548 45.08c-.25.07-.504.105-.752.105zm0 10.37c-1.22 0-2.34-.808-2.684-2.04-.41-1.484.456-3.02 1.94-3.437l22.39-6.25c1.484-.413 3.02.454 3.438 1.937.414 1.484-.453 3.022-1.937 3.436l-22.393 6.254c-.25.07-.504.104-.752.104zM106.837 8.44V6.654c0-3.613-3.02-7.324-6.55-6.55-9.413 2.06-30.72 8.958-41.854 11.352-3.53.76-6.552 3.736-6.552 7.35v60.95c0 3.614 2.98 7.062 6.556 6.553 2-.287 4.267-.75 6.728-1.34v1.425c0 3.613 2.976 7.06 6.552 6.552 4.176-.595 26.68-7.4 32.483-9.11V78.46c-5.568 1.64-28.035 8.31-32.484 9.35-.76.18-1.416-.635-1.416-1.416V26.74c-.08-1.792.62-3.287 2.714-3.847 6.07-1.623 21.953-5.945 31.945-8.668l1.88-.512 6.73-1.834c.78 0 1.413.63 1.413 1.412v60.953c0 .78-.665 1.203-1.416 1.416-2.596.74-5.82 1.714-9.382 2.8l.013 5.376c3.404-1.12 6.6-2.17 9.37-3.04 3.444-1.083 6.55-2.37 6.55-6.552v-60.95c0-3.613-3.02-7.325-6.55-6.55-1.84.4-4.143.99-6.73 1.694zm-35.124 9.656c-3.53.76-6.55 3.737-6.55 7.35V79.46c-2.39.648-4.652 1.23-6.73 1.715-.76.178-1.415-.636-1.415-1.417V20.1c-.078-1.792.62-3.287 2.715-3.847C68.876 13.81 100.287 5.24 100.287 5.24c.78 0 1.416.634 1.416 1.415v3.217c-10.06 2.86-22.39 6.59-29.99 8.224zM168 42l-12-12v8h-30.634v8H156v8l12-12zM43 42L31 30v8H.366v8H31v8l12-12z" fill-rule="evenodd"/></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3.7 KiB

After

Width:  |  Height:  |  Size: 1.7 KiB

Before After
Before After

16
1-js/4-data-structures/7-array/stack.svg
View file

@ -1,15 +1 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="90px" height="97px" viewBox="0 0 90 97" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
<!-- Generator: Sketch 3.2.2 (9983) - http://www.bohemiancoding.com/sketch -->
<title>Slice 1</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="stack" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
<path d="M17.9304166,50.5138979 C16.7833461,50.5138979 15.7302978,50.0718276 15.4068616,49.3963968 C15.0166696,48.5840173 15.8318418,47.741509 17.2271308,47.5141742 L38.2805745,44.0888141 C39.6749232,43.8620271 41.1209842,44.3369651 41.5121164,45.1493446 C41.9013682,45.9622719 41.086196,46.8047801 39.690907,47.0315671 L18.6374633,50.4569273 C18.4014676,50.4952729 18.1635915,50.5138979 17.9304166,50.5138979 L17.9304166,50.5138979 Z" id="Shape-3" fill="#000000" sketch:type="MSShapeGroup" transform="translate(28.459289, 47.273049) rotate(-21.000000) translate(-28.459289, -47.273049) "></path>
<path d="M24.9304166,55.5138979 C23.7833461,55.5138979 22.7302978,55.0718276 22.4068616,54.3963968 C22.0166696,53.5840173 22.8318418,52.741509 24.2271308,52.5141742 L45.2805745,49.0888141 C46.6749232,48.8620271 48.1209842,49.3369651 48.5121164,50.1493446 C48.9013682,50.9622719 48.086196,51.8047801 46.690907,52.0315671 L25.6374633,55.4569273 C25.4014676,55.4952729 25.1635915,55.5138979 24.9304166,55.5138979 L24.9304166,55.5138979 Z" id="Shape-4" fill="#000000" sketch:type="MSShapeGroup" transform="translate(35.459289, 52.273049) rotate(-21.000000) translate(-35.459289, -52.273049) "></path>
<path d="M31.9304166,59.5138979 C30.7833461,59.5138979 29.7302978,59.0718276 29.4068616,58.3963968 C29.0166696,57.5840173 29.8318418,56.741509 31.2271308,56.5141742 L52.2805745,53.0888141 C53.6749232,52.8620271 55.1209842,53.3369651 55.5121164,54.1493446 C55.9013682,54.9622719 55.086196,55.8047801 53.690907,56.0315671 L32.6374633,59.4569273 C32.4014676,59.4952729 32.1635915,59.5138979 31.9304166,59.5138979 L31.9304166,59.5138979 Z" id="Shape-5" fill="#000000" sketch:type="MSShapeGroup" transform="translate(42.459289, 56.273049) rotate(-21.000000) translate(-42.459289, -56.273049) "></path>
<path d="M89.999,67.92075 C89.999,67.52575 89.787,67.16175 89.445,66.96475 L85.798,64.85975 L89.445,62.75275 C89.787,62.55575 89.999,62.19075 89.999,61.79675 C89.999,61.40075 89.787,61.03775 89.445,60.84075 L38.02,31.14775 C37.678,30.95075 37.257,30.95075 36.915,31.14775 L0.552,52.14275 C0.21,52.33975 1.77635684e-15,52.70475 1.77635684e-15,53.09975 C1.77635684e-15,53.49475 0.21,53.85875 0.552,54.05575 L4.2,56.16275 L0.552,58.26875 C0.21,58.46575 1.77635684e-15,58.83075 1.77635684e-15,59.22475 C1.77635684e-15,59.62075 0.21,59.98475 0.552,60.18275 L4.201,62.28875 L0.552,64.39475 C0.21,64.59175 0,64.95675 0,65.35175 C0,65.74675 0.21,66.11075 0.552,66.30775 L51.979,95.99875 C52.15,96.09775 52.34,96.14675 52.531,96.14675 C52.722,96.14675 52.913,96.09675 53.084,95.99875 L89.446,75.00475 C89.788,74.80775 90,74.44275 90,74.04775 C90,73.65275 89.788,73.28775 89.446,73.09175 L85.798,70.98475 L89.446,68.87875 C89.787,68.68075 89.999,68.31575 89.999,67.92075 L89.999,67.92075 Z M37.467,33.37975 L86.684,61.79575 L52.531,81.51575 L3.313,53.09975 L37.467,33.37975 L37.467,33.37975 Z M83.737,72.34575 L86.684,74.04775 L52.531,93.76775 L3.313,65.35175 L6.409,63.56375 L51.979,89.87375 C52.15,89.97275 52.34,90.02075 52.531,90.02075 C52.722,90.02075 52.913,89.97175 53.084,89.87375 L83.605,72.25075 C83.646,72.28475 83.689,72.31875 83.737,72.34575 L83.737,72.34575 Z M52.531,87.64075 L3.369,59.25775 L3.313,59.22475 L6.409,57.43775 L51.979,83.74775 C52.15,83.84675 52.34,83.89575 52.531,83.89575 C52.722,83.89575 52.913,83.84575 53.084,83.74775 L83.685,66.07975 C83.774,66.20075 83.886,66.30675 84.024,66.38675 L86.685,67.92175 L52.531,87.64075 L52.531,87.64075 Z" id="Shape" fill="#000000" sketch:type="MSShapeGroup"></path>
<path d="M36.5349323,0.361 C36.3172807,0.116 36.0511792,0 35.7686793,0 C35.2044249,0 34.5730861,0.463 34.1251114,1.295 L27.2914468,13.967 C26.6936502,15.077 27.0767767,16.382 27.8847711,16.382 C27.9853977,16.382 28.0934781,16.362 28.2067762,16.319 L31.5252181,15.036 L31.5744133,40.628 L40.6710587,34.6514359 L40.6710585,11.484 L43.9909911,10.199 C45.0076925,9.805 45.3073362,8.883 44.6536359,8.148 L36.5349323,0.361 Z" id="Shape" fill="#000000" sketch:type="MSShapeGroup" transform="translate(36.000000, 20.314000) scale(1, -1) translate(-36.000000, -20.314000) "></path>
<path d="M59.5349323,17.361 C59.3172807,17.116 59.0511792,17 58.7686793,17 C58.2044249,17 57.5730861,17.463 57.1251114,18.295 L50.2914468,30.967 C49.6936502,32.077 50.0767767,33.382 50.8847711,33.382 C50.9853977,33.382 51.0934781,33.362 51.2067762,33.319 L54.5252181,32.036 L54.5744133,57.628 L63.6710587,63.2197266 L63.6710585,28.484 L66.9909911,27.199 C68.0076925,26.805 68.3073362,25.883 67.6536359,25.148 L59.5349323,17.361 Z" id="Shape-2" fill="#000000" sketch:type="MSShapeGroup"></path>
</g>
</svg>
<svg width="90" height="97" viewBox="0 0 90 97" xmlns="http://www.w3.org/2000/svg"><title>Slice 1</title><desc>Created with Sketch.</desc><path d="M19.785 54.07c-1.07.41-2.213.374-2.757-.14-.655-.62-.196-1.7 1.026-2.41l18.438-10.737c1.22-.71 2.742-.786 3.398-.167.654.62.195 1.7-1.027 2.41L20.425 53.763c-.207.12-.422.222-.64.306zm7 5c-1.07.41-2.213.374-2.757-.14-.655-.62-.196-1.7 1.026-2.41l18.438-10.737c1.22-.71 2.742-.786 3.398-.167.654.62.195 1.7-1.027 2.41L27.425 58.763c-.207.12-.422.222-.64.306zm7 4c-1.07.41-2.213.374-2.757-.14-.655-.62-.196-1.7 1.026-2.41l18.438-10.737c1.22-.71 2.742-.786 3.398-.167.654.62.195 1.7-1.027 2.41L34.425 62.763c-.207.12-.422.222-.64.306zM90 67.92c0-.394-.213-.758-.555-.955l-3.647-2.105 3.647-2.107c.342-.197.554-.562.554-.956 0-.396-.216-.76-.558-.956L38.02 31.15c-.342-.197-.763-.197-1.105 0L.552 52.143C.21 52.34 0 52.705 0 53.1c0 .395.21.76.552.956L4.2 56.163.552 58.27c-.342.196-.552.56-.552.955 0 .396.21.76.552.958l3.65 2.106-3.65 2.102C.21 64.59 0 64.956 0 65.35c0 .396.21.76.552.957l51.427 29.69c.17.1.36.15.55.15.19 0 .38-.05.55-.15l36.363-20.993c.342-.197.554-.562.554-.957 0-.395-.213-.76-.555-.956l-3.648-2.104 3.648-2.106c.34-.2.553-.565.553-.96zM37.466 33.38l49.217 28.416-34.153 19.72L3.314 53.1l34.154-19.72zm46.27 38.966l2.947 1.702-34.153 19.72L3.314 65.352l3.096-1.788 45.57 26.31c.17.1.36.147.55.147.192 0 .383-.045.554-.143l30.52-17.623c.042.035.085.07.133.096zM52.53 87.64L3.37 59.26l-.057-.033L6.41 57.44l45.57 26.31c.17.1.36.148.55.148.19 0 .382-.05.553-.148l30.6-17.668c.09.12.202.227.34.307l2.66 1.532-34.153 19.72zM36.535 40.267c-.218.245-.484.36-.766.36-.57 0-1.2-.462-1.648-1.294L27.29 26.66c-.596-1.11-.213-2.414.595-2.414.1 0 .208.02.322.063l3.318 1.28.05-25.59 9.096 5.975v23.167l3.32 1.285c1.02.392 1.32 1.314.667 2.05l-8.12 7.786zm23-22.907c-.218-.244-.484-.36-.766-.36-.57 0-1.2.463-1.648 1.295L50.29 30.967c-.596 1.11-.213 2.415.595 2.415.1 0 .208-.02.322-.063l3.318-1.287.05 25.592 9.096 5.592V28.483l3.32-1.285c1.02-.396 1.32-1.318.667-2.053l-8.12-7.787z" fill-rule="evenodd"/></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 5 KiB

After

Width:  |  Height:  |  Size: 2 KiB

Before After
Before After

65
1-js/4-data-structures/9-array-iteration/reduce.svg
View file

@ -1,64 +1 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="600px" height="105px" viewBox="0 0 600 105" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
<!-- Generator: Sketch 3.2.2 (9983) - http://www.bohemiancoding.com/sketch -->
<title>Slice 1</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="reduce" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
<rect id="Rectangle-1" stroke="#979797" sketch:type="MSShapeGroup" x="0" y="65" width="80" height="40"></rect>
<text id="1" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="36" y="90">1</tspan>
</text>
<text id="sum" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="7" y="8">sum</tspan>
<tspan x="7" y="24">0</tspan>
<tspan x="7" y="40">current</tspan>
<tspan x="7" y="56">1</tspan>
</text>
<rect id="Rectangle-2" stroke="#979797" sketch:type="MSShapeGroup" x="79" y="65" width="80" height="40"></rect>
<text id="2" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="115" y="90">2</tspan>
</text>
<text id="sum" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="86" y="8">sum</tspan>
<tspan x="86" y="24">0+1</tspan>
<tspan x="86" y="40">current</tspan>
<tspan x="86" y="56">2</tspan>
</text>
<rect id="Rectangle-3" stroke="#979797" sketch:type="MSShapeGroup" x="158" y="65" width="80" height="40"></rect>
<text id="3" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="194" y="90">3</tspan>
</text>
<text id="sum" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="165" y="8">sum</tspan>
<tspan x="165" y="24">0+1+2</tspan>
<tspan x="165" y="40">current</tspan>
<tspan x="165" y="56">3</tspan>
</text>
<rect id="Rectangle-5" stroke="#979797" sketch:type="MSShapeGroup" x="237" y="65" width="80" height="40"></rect>
<text id="4" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="273" y="90">4</tspan>
</text>
<text id="sum" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="244" y="8">sum</tspan>
<tspan x="244" y="24">0+1+2+3</tspan>
<tspan x="244" y="40">current</tspan>
<tspan x="244" y="56">4</tspan>
</text>
<rect id="Rectangle-4" stroke="#979797" sketch:type="MSShapeGroup" x="316" y="65" width="80" height="40"></rect>
<text id="5" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="352" y="90">5</tspan>
</text>
<text id="sum" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="323" y="8">sum</tspan>
<tspan x="323" y="24">0+1+2+3+4</tspan>
<tspan x="323" y="40">current</tspan>
<tspan x="323" y="56">5</tspan>
</text>
<path d="M412.5,83 L462.5,83" id="Line" stroke="#979797" stroke-width="2" stroke-linecap="square" fill="#979797" sketch:type="MSShapeGroup"></path>
<path id="Line-decoration-1" d="M462.5,83 C458.72,81.95 455.48,81.05 451.7,80 C451.7,82.1 451.7,83.9 451.7,86 C455.48,84.95 458.72,84.05 462.5,83 C462.5,83 462.5,83 462.5,83 Z" stroke="#979797" stroke-width="2" stroke-linecap="square" fill="#979797"></path>
<text id="0+1+2+3+4+5-=-15" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="477" y="87">0+1+2+3+4+5 = 15</tspan>
</text>
</g>
</svg>
<svg width="600" height="105" viewBox="0 0 600 105" xmlns="http://www.w3.org/2000/svg"><title>Slice 1</title><desc>Created with Sketch.</desc><g fill="none" fill-rule="evenodd"><path stroke="#979797" d="M0 65h80v40H0z"/><text font-family="Consolas" font-size="14" fill="#000"><tspan x="36" y="90">1</tspan></text><text id="sum" font-family="Consolas" font-size="14" fill="#000"><tspan x="7" y="8">sum</tspan><tspan x="7" y="24">0</tspan><tspan x="7" y="40">current</tspan><tspan x="7" y="56">1</tspan></text><path stroke="#979797" d="M79 65h80v40H79z"/><text font-family="Consolas" font-size="14" fill="#000"><tspan x="115" y="90">2</tspan></text><text font-family="Consolas" font-size="14" fill="#000"><tspan x="86" y="8">sum</tspan><tspan x="86" y="24">0+1</tspan><tspan x="86" y="40">current</tspan><tspan x="86" y="56">2</tspan></text><path stroke="#979797" d="M158 65h80v40h-80z"/><text font-family="Consolas" font-size="14" fill="#000"><tspan x="194" y="90">3</tspan></text><text font-family="Consolas" font-size="14" fill="#000"><tspan x="165" y="8">sum</tspan><tspan x="165" y="24">0+1+2</tspan><tspan x="165" y="40">current</tspan><tspan x="165" y="56">3</tspan></text><path stroke="#979797" d="M237 65h80v40h-80z"/><text font-family="Consolas" font-size="14" fill="#000"><tspan x="273" y="90">4</tspan></text><text font-family="Consolas" font-size="14" fill="#000"><tspan x="244" y="8">sum</tspan><tspan x="244" y="24">0+1+2+3</tspan><tspan x="244" y="40">current</tspan><tspan x="244" y="56">4</tspan></text><path stroke="#979797" d="M316 65h80v40h-80z"/><text font-family="Consolas" font-size="14" fill="#000"><tspan x="352" y="90">5</tspan></text><text font-family="Consolas" font-size="14" fill="#000"><tspan x="323" y="8">sum</tspan><tspan x="323" y="24">0+1+2+3+4</tspan><tspan x="323" y="40">current</tspan><tspan x="323" y="56">5</tspan></text><path d="M412.5 83h50" stroke="#979797" stroke-width="2" stroke-linecap="square" fill="#979797"/><path d="M462.5 83l-10.8-3v6l10.8-3z" stroke="#979797" stroke-width="2" stroke-linecap="square" fill="#979797"/><text font-family="Consolas" font-size="14" fill="#000"><tspan x="477" y="87">0+1+2+3+4+5 = 15</tspan></text></g></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 4.2 KiB

After

Width:  |  Height:  |  Size: 2.1 KiB

Before After
Before After

BIN
1-js/5-functions-closures/2-closures/1.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 7.8 KiB

After

Width:  |  Height:  |  Size: 4.8 KiB

Before After
Before After

BIN
1-js/5-functions-closures/2-closures/1@2x.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 17 KiB

After

Width:  |  Height:  |  Size: 9.1 KiB

Before After
Before After

BIN
1-js/5-functions-closures/2-closures/2.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 4.5 KiB

After

Width:  |  Height:  |  Size: 3.1 KiB

Before After
Before After

BIN
1-js/5-functions-closures/2-closures/2@2x.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 9.9 KiB

After

Width:  |  Height:  |  Size: 5.7 KiB

Before After
Before After

BIN
1-js/5-functions-closures/2-closures/3.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 8.4 KiB

After

Width:  |  Height:  |  Size: 4.8 KiB

Before After
Before After

BIN
1-js/5-functions-closures/2-closures/3@2x.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 19 KiB

After

Width:  |  Height:  |  Size: 10 KiB

Before After
Before After

BIN
1-js/5-functions-closures/2-closures/4.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 12 KiB

After

Width:  |  Height:  |  Size: 7 KiB

Before After
Before After

BIN
1-js/5-functions-closures/2-closures/4@2x.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 28 KiB

After

Width:  |  Height:  |  Size: 14 KiB

Before After
Before After

BIN
1-js/5-functions-closures/2-closures/5.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 11 KiB

After

Width:  |  Height:  |  Size: 6.3 KiB

Before After
Before After

BIN
1-js/5-functions-closures/2-closures/5@2x.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 25 KiB

After

Width:  |  Height:  |  Size: 13 KiB

Before After
Before After

BIN
1-js/5-functions-closures/2-closures/6.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 21 KiB

After

Width:  |  Height:  |  Size: 11 KiB

Before After
Before After

BIN
1-js/5-functions-closures/2-closures/6@2x.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 46 KiB

After

Width:  |  Height:  |  Size: 23 KiB

Before After
Before After

60
1-js/5-functions-closures/6-memory-management/family-no-family.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: 5.4 KiB

Before After
Before After

38
1-js/5-functions-closures/6-memory-management/family-no-father-2.svg
View file

@ -1,37 +1 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="120px" height="203px" viewBox="0 0 120 203" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
<!-- Generator: Sketch 3.2.2 (9983) - http://www.bohemiancoding.com/sketch -->
<title>family-no-father-2</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="family-no-father-2" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
<rect id="Rectangle-1" stroke="#979797" sketch:type="MSShapeGroup" x="18" y="18" width="80" height="30"></rect>
<text id="window" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="18" y="11">window</tspan>
</text>
<text id="Корень" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="35" y="37">Корень</tspan>
</text>
<rect id="Rectangle-2" stroke="#979797" fill="#E8E8E8" sketch:type="MSShapeGroup" x="18" y="85" width="80" height="28"></rect>
<text id="Object" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="35" y="102">Object</tspan>
</text>
<text id="family" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="3" y="69">family</tspan>
</text>
<rect id="Rectangle-4" stroke="#979797" fill="#E8E8E8" sketch:type="MSShapeGroup" x="0" y="153" width="120" height="50"></rect>
<text id="name:-&quot;Мария&quot;" sketch:type="MSTextLayer" font-family="Consolas" font-size="12" font-weight="normal" fill="#000000">
<tspan x="23" y="191">name: "Мария"</tspan>
</text>
<text id="mother" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="5" y="136">mother</tspan>
</text>
<text id="Object-3" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="37" y="171">Object</tspan>
</text>
<path d="M59.5,50.5 L59.5,81.5" id="Line" stroke="#979797" stroke-linecap="square" fill="#979797" sketch:type="MSShapeGroup"></path>
<path id="Line-decoration-1" d="M59.5,81.5 C60.55,77.72 61.45,74.48 62.5,70.7 C60.4,70.7 58.6,70.7 56.5,70.7 C57.55,74.48 58.45,77.72 59.5,81.5 C59.5,81.5 59.5,81.5 59.5,81.5 Z" stroke="#979797" stroke-linecap="square" fill="#979797"></path>
<path d="M58.5,117.5 L58.5,149.5" id="Line" stroke="#979797" stroke-linecap="square" fill="#979797" sketch:type="MSShapeGroup"></path>
<path id="Line-decoration-1" d="M58.5,149.5 C59.55,145.72 60.45,142.48 61.5,138.7 C59.4,138.7 57.6,138.7 55.5,138.7 C56.55,142.48 57.45,145.72 58.5,149.5 C58.5,149.5 58.5,149.5 58.5,149.5 Z" stroke="#979797" stroke-linecap="square" fill="#979797"></path>
</g>
</svg>
<svg width="120" height="203" viewBox="0 0 120 203" xmlns="http://www.w3.org/2000/svg"><title>family-no-father-2</title><desc>Created with Sketch.</desc><g fill="none" fill-rule="evenodd"><path stroke="#979797" d="M18 18h80v30H18z"/><text font-family="Consolas" font-size="14" fill="#000"><tspan x="18" y="11">window</tspan></text><text font-family="Consolas" font-size="14" fill="#000"><tspan x="35" y="37">Корень</tspan></text><path stroke="#979797" fill="#E8E8E8" d="M18 85h80v28H18z"/><text font-family="Consolas" font-size="14" fill="#000"><tspan x="35" y="102">Object</tspan></text><text font-family="Consolas" font-size="14" fill="#000"><tspan x="3" y="69">family</tspan></text><path stroke="#979797" fill="#E8E8E8" d="M0 153h120v50H0z"/><text font-family="Consolas" font-size="12" fill="#000"><tspan x="23" y="191">name: &amp;quot;Мария&amp;quot;</tspan></text><text font-family="Consolas" font-size="14" fill="#000"><tspan x="5" y="136">mother</tspan></text><text font-family="Consolas" font-size="14" fill="#000"><tspan x="37" y="171">Object</tspan></text><path d="M59.5 50.5v31M59.5 81.5l3-10.8h-6l3 10.8zm-1 36v32" stroke="#979797" stroke-linecap="square" fill="#979797"/><path d="M58.5 149.5l3-10.8h-6l3 10.8z" stroke="#979797" stroke-linecap="square" fill="#979797"/></g></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3.1 KiB

After

Width:  |  Height:  |  Size: 1.3 KiB

Before After
Before After

52
1-js/5-functions-closures/6-memory-management/family-no-father.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: 5 KiB

Before After
Before After

60
1-js/5-functions-closures/6-memory-management/family.svg
View file

@ -1,59 +1 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="329px" height="203px" viewBox="0 0 329 203" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
<!-- Generator: Sketch 3.2.2 (9983) - http://www.bohemiancoding.com/sketch -->
<title>family</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="family" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
<path d="M188.5,196.5 L129.5,196.5" id="Line" stroke="#979797" stroke-linecap="square" fill="#979797" sketch:type="MSShapeGroup"></path>
<path id="Line-decoration-1" d="M129.5,196.5 C133.28,197.55 136.52,198.45 140.3,199.5 C140.3,197.4 140.3,195.6 140.3,193.5 C136.52,194.55 133.28,195.45 129.5,196.5 C129.5,196.5 129.5,196.5 129.5,196.5 Z" stroke="#979797" stroke-linecap="square" fill="#979797"></path>
<rect id="Rectangle-1" stroke="#979797" sketch:type="MSShapeGroup" x="118" y="18" width="80" height="30"></rect>
<text id="window" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="118" y="11">window</tspan>
</text>
<text id="Корень" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="135" y="37">Корень</tspan>
</text>
<rect id="Rectangle-2" stroke="#979797" fill="#E8E8E8" sketch:type="MSShapeGroup" x="118" y="85" width="80" height="28"></rect>
<text id="Object" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="135" y="102">Object</tspan>
</text>
<rect id="Rectangle-3" stroke="#979797" fill="#E8E8E8" sketch:type="MSShapeGroup" x="0" y="153" width="120" height="50"></rect>
<text id="Object-2" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="35" y="171">Object</tspan>
</text>
<text id="father" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="31" y="133">father</tspan>
</text>
<text id="wife" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="143" y="154">wife</tspan>
</text>
<text sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="103" y="69">family</tspan>
</text>
<text id="name:-&quot;Василий&quot;" sketch:type="MSTextLayer" font-family="Consolas" font-size="12" font-weight="normal" fill="#000000">
<tspan x="15" y="191">name: "Василий"</tspan>
</text>
<rect id="Rectangle-4" stroke="#979797" fill="#E8E8E8" sketch:type="MSShapeGroup" x="209" y="153" width="120" height="50"></rect>
<text id="name:-&quot;Мария&quot;" sketch:type="MSTextLayer" font-family="Consolas" font-size="12" font-weight="normal" fill="#000000">
<tspan x="226" y="191">name: "Мария"</tspan>
</text>
<text id="mother" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="238" y="133">mother</tspan>
</text>
<text id="Object-3" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="240" y="171">Object</tspan>
</text>
<path d="M159.5,50.5 L159.5,81.5" id="Line" stroke="#979797" stroke-linecap="square" fill="#979797" sketch:type="MSShapeGroup"></path>
<path id="Line-decoration-1" d="M159.5,81.5 C160.55,77.72 161.45,74.48 162.5,70.7 C160.4,70.7 158.6,70.7 156.5,70.7 C157.55,74.48 158.45,77.72 159.5,81.5 C159.5,81.5 159.5,81.5 159.5,81.5 Z" stroke="#979797" stroke-linecap="square" fill="#979797"></path>
<path d="M110.5,118.5 L64.5,150.5" id="Line-2" stroke="#979797" stroke-linecap="square" fill="#979797" sketch:type="MSShapeGroup"></path>
<path id="Line-2-decoration-1" d="M64.5293087,150.479611 C68.2319481,149.182938 71.405639,148.071504 75.1082783,146.77483 C73.9090429,145.05093 72.8811268,143.5733 71.6818914,141.849399 C69.1784875,144.869973 67.0327127,147.459037 64.5293087,150.479611 C64.5293087,150.479611 64.5293087,150.479611 64.5293087,150.479611 Z" stroke="#979797" stroke-linecap="square" fill="#979797"></path>
<path d="M129.5,162.5 L190.5,162.5" id="Line" stroke="#979797" stroke-linecap="square" fill="#9B9B9B" sketch:type="MSShapeGroup"></path>
<path id="Line-decoration-1" d="M190.5,162.5 C186.72,161.45 183.48,160.55 179.7,159.5 C179.7,161.6 179.7,163.4 179.7,165.5 C183.48,164.45 186.72,163.55 190.5,162.5 C190.5,162.5 190.5,162.5 190.5,162.5 Z" stroke="#979797" stroke-linecap="square" fill="#9B9B9B"></path>
<text id="husband" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="132" y="187">husband</tspan>
</text>
<path d="M204.5,118.5 L251.5,150.5" id="Line" stroke="#979797" stroke-linecap="square" fill="#979797" sketch:type="MSShapeGroup"></path>
<path id="Line-decoration-1" d="M250.789558,150.016295 C248.255943,147.021016 246.084274,144.453634 243.550659,141.458354 C242.368798,143.194213 241.355774,144.682091 240.173913,146.41795 C243.889389,147.677371 247.074082,148.756874 250.789558,150.016295 C250.789558,150.016295 250.789558,150.016295 250.789558,150.016295 Z" stroke="#979797" stroke-linecap="square" fill="#979797"></path>
</g>
</svg>
<svg width="329" height="203" viewBox="0 0 329 203" xmlns="http://www.w3.org/2000/svg"><title>family</title><desc>Created with Sketch.</desc><g fill="none" fill-rule="evenodd"><path d="M188.5 196.5h-59" stroke="#979797" stroke-linecap="square" fill="#979797"/><path d="M129.5 196.5l10.8 3v-6l-10.8 3z" stroke="#979797" stroke-linecap="square" fill="#979797"/><path stroke="#979797" d="M118 18h80v30h-80z"/><text font-family="Consolas" font-size="14" fill="#000"><tspan x="118" y="11">window</tspan></text><text font-family="Consolas" font-size="14" fill="#000"><tspan x="135" y="37">Корень</tspan></text><path stroke="#979797" fill="#E8E8E8" d="M118 85h80v28h-80z"/><text font-family="Consolas" font-size="14" fill="#000"><tspan x="135" y="102">Object</tspan></text><path stroke="#979797" fill="#E8E8E8" d="M0 153h120v50H0z"/><text font-family="Consolas" font-size="14" fill="#000"><tspan x="35" y="171">Object</tspan></text><text font-family="Consolas" font-size="14" fill="#000"><tspan x="31" y="133">father</tspan></text><text font-family="Consolas" font-size="14" fill="#000"><tspan x="143" y="154">wife</tspan></text><text font-family="Consolas" font-size="14" fill="#000"><tspan x="103" y="69">family</tspan></text><text font-family="Consolas" font-size="12" fill="#000"><tspan x="15" y="191">name: &amp;quot;Василий&amp;quot;</tspan></text><path stroke="#979797" fill="#E8E8E8" d="M209 153h120v50H209z"/><text font-family="Consolas" font-size="12" fill="#000"><tspan x="226" y="191">name: &amp;quot;Мария&amp;quot;</tspan></text><text font-family="Consolas" font-size="14" fill="#000"><tspan x="238" y="133">mother</tspan></text><text font-family="Consolas" font-size="14" fill="#000"><tspan x="240" y="171">Object</tspan></text><path d="M159.5 50.5v31" stroke="#979797" stroke-linecap="square" fill="#979797"/><path d="M159.5 81.5l3-10.8h-6l3 10.8zM110.5 118.5l-46 32" stroke="#979797" stroke-linecap="square" fill="#979797"/><path d="M64.53 150.48l10.578-3.705-3.426-4.926-7.153 8.63z" stroke="#979797" stroke-linecap="square" fill="#979797"/><path d="M129.5 162.5h61" stroke="#979797" stroke-linecap="square" fill="#9B9B9B"/><path d="M190.5 162.5l-10.8-3v6l10.8-3z" stroke="#979797" stroke-linecap="square" fill="#9B9B9B"/><text font-family="Consolas" font-size="14" fill="#000"><tspan x="132" y="187">husband</tspan></text><path d="M204.5 118.5l47 32" stroke="#979797" stroke-linecap="square" fill="#979797"/><path d="M250.79 150.016l-7.24-8.558c-1.18 1.736-2.194 3.224-3.376 4.96 3.715 1.26 6.9 2.34 10.616 3.598z" stroke="#979797" stroke-linecap="square" fill="#979797"/></g></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 5.7 KiB

After

Width:  |  Height:  |  Size: 2.6 KiB

Before After
Before After

52
1-js/7-js-misc/3-setTimeout-setInterval/setinterval-interval.svg
View file

@ -1,51 +1 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="631px" height="223px" viewBox="0 0 631 223" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
<!-- Generator: Sketch 3.2.2 (9983) - http://www.bohemiancoding.com/sketch -->
<title>setinterval-interval</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="setinterval-interval" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
<path d="M32.5,122.5 L582.5,122.5" id="Line" stroke="#979797" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<g id="Rectangle-1-+-func(1)-+-noun_60230_cc" sketch:type="MSLayerGroup" transform="translate(128.000000, 41.000000)">
<rect id="Rectangle-1" stroke="#979797" fill="#FFFFFF" sketch:type="MSShapeGroup" x="3" y="60" width="90" height="40"></rect>
<text id="func(1)" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="25" y="84">func(1)</tspan>
</text>
<g id="noun_60230_cc" fill="#000000" sketch:type="MSShapeGroup">
<path d="M22.5818182,19.3424658 L12.9113636,16.4383562 L20.4909091,0.273972603 L0.470454545,21.0958904 L10.1931818,24 L4.28636364,39.890411 L22.5818182,19.3424658 L22.5818182,19.3424658 Z M2.19545455,20.6575342 L17.3022727,4.93150685 L11.6045455,17.0410959 L20.8568182,19.7808219 L6.9,35.6164384 L11.4477273,23.3972603 L2.19545455,20.6575342 L2.19545455,20.6575342 Z" id="Shape"></path>
</g>
<path d="M3,114.5 L3,44.5" id="Line" stroke="#373535" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
</g>
<g id="Rectangle-1-+-func(1)-+-noun_60230_cc-2" sketch:type="MSLayerGroup" transform="translate(271.000000, 41.000000)">
<rect id="Rectangle-1" stroke="#979797" fill="#FFFFFF" sketch:type="MSShapeGroup" x="3" y="60" width="90" height="40"></rect>
<text id="func(2)" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="25" y="84">func(2)</tspan>
</text>
<g id="noun_60230_cc" fill="#000000" sketch:type="MSShapeGroup">
<path d="M22.5818182,19.3424658 L12.9113636,16.4383562 L20.4909091,0.273972603 L0.470454545,21.0958904 L10.1931818,24 L4.28636364,39.890411 L22.5818182,19.3424658 L22.5818182,19.3424658 Z M2.19545455,20.6575342 L17.3022727,4.93150685 L11.6045455,17.0410959 L20.8568182,19.7808219 L6.9,35.6164384 L11.4477273,23.3972603 L2.19545455,20.6575342 L2.19545455,20.6575342 Z" id="Shape"></path>
</g>
<path d="M3,114.5 L3,44.5" id="Line" stroke="#373535" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
</g>
<g id="Rectangle-1-+-func(1)-+-noun_60230_cc-3" sketch:type="MSLayerGroup" transform="translate(405.000000, 41.000000)">
<rect id="Rectangle-1" stroke="#979797" fill="#FFFFFF" sketch:type="MSShapeGroup" x="3" y="60" width="90" height="40"></rect>
<text id="func(3)" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="25" y="84">func(3)</tspan>
</text>
<g id="noun_60230_cc" fill="#000000" sketch:type="MSShapeGroup">
<path d="M22.5818182,19.3424658 L12.9113636,16.4383562 L20.4909091,0.273972603 L0.470454545,21.0958904 L10.1931818,24 L4.28636364,39.890411 L22.5818182,19.3424658 L22.5818182,19.3424658 Z M2.19545455,20.6575342 L17.3022727,4.93150685 L11.6045455,17.0410959 L20.8568182,19.7808219 L6.9,35.6164384 L11.4477273,23.3972603 L2.19545455,20.6575342 L2.19545455,20.6575342 Z" id="Shape"></path>
</g>
<path d="M3,114.5 L3,44.5" id="Line" stroke="#373535" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
</g>
<text id="100" sketch:type="MSTextLayer" font-family="Consolas" font-size="18" font-weight="normal" fill="#000000">
<tspan x="115" y="183">100</tspan>
</text>
<text id="200" sketch:type="MSTextLayer" font-family="Consolas" font-size="18" font-weight="normal" fill="#000000">
<tspan x="259" y="183">200</tspan>
</text>
<text id="300" sketch:type="MSTextLayer" font-family="Consolas" font-size="18" font-weight="normal" fill="#000000">
<tspan x="394" y="183">300</tspan>
</text>
<path d="M221.5,122.5 L271.5,122.5" id="Line" stroke="#4990E2" stroke-width="3" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<path d="M364.5,122.5 L405.5,122.5" id="Line-2" stroke="#4990E2" stroke-width="3" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
</g>
</svg>
<svg width="631" height="223" viewBox="0 0 631 223" xmlns="http://www.w3.org/2000/svg"><title>setinterval-interval</title><desc>Created with Sketch.</desc><g fill="none" fill-rule="evenodd"><path d="M32.5 122.5h550" id="Line" stroke="#979797" stroke-linecap="square"/><path stroke="#979797" fill="#fff" d="M131 101h90v40h-90z"/><text font-family="Consolas" font-size="14" fill="#000" transform="translate(128 41)"><tspan x="25" y="84">func(1)</tspan></text><path d="M150.582 60.342l-9.67-2.904 7.58-16.164-20.022 20.822L138.193 65l-5.907 15.89 18.296-20.548zm-20.387 1.316l15.107-15.726-5.697 12.11 9.252 2.74L134.9 76.615l4.548-12.22-9.253-2.738z" fill="#000"/><path d="M131 155.5v-70" stroke="#373535" stroke-width="2" stroke-linecap="square"/><path stroke="#979797" fill="#fff" d="M274 101h90v40h-90z"/><text font-family="Consolas" font-size="14" fill="#000" transform="translate(271 41)"><tspan x="25" y="84">func(2)</tspan></text><path d="M293.582 60.342l-9.67-2.904 7.58-16.164-20.022 20.822L281.193 65l-5.907 15.89 18.296-20.548zm-20.387 1.316l15.107-15.726-5.697 12.11 9.252 2.74L277.9 76.615l4.548-12.22-9.253-2.738z" fill="#000"/><path d="M274 155.5v-70" stroke="#373535" stroke-width="2" stroke-linecap="square"/><path stroke="#979797" fill="#fff" d="M408 101h90v40h-90z"/><text font-family="Consolas" font-size="14" fill="#000" transform="translate(405 41)"><tspan x="25" y="84">func(3)</tspan></text><path d="M427.582 60.342l-9.67-2.904 7.58-16.164-20.022 20.822L415.193 65l-5.907 15.89 18.296-20.548zm-20.387 1.316l15.107-15.726-5.697 12.11 9.252 2.74L411.9 76.615l4.548-12.22-9.253-2.738z" fill="#000"/><path d="M408 155.5v-70" stroke="#373535" stroke-width="2" stroke-linecap="square"/><text font-family="Consolas" font-size="18" fill="#000"><tspan x="115" y="183">100</tspan></text><text font-family="Consolas" font-size="18" fill="#000"><tspan x="259" y="183">200</tspan></text><text font-family="Consolas" font-size="18" fill="#000"><tspan x="394" y="183">300</tspan></text><path d="M221.5 122.5h50m93 0h41" stroke="#4990E2" stroke-width="3" stroke-linecap="square"/></g></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 4.8 KiB

After

Width:  |  Height:  |  Size: 2 KiB

Before After
Before After

63
1-js/7-js-misc/3-setTimeout-setInterval/settimeout-interval.svg
View file

@ -1,62 +1 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="631px" height="223px" viewBox="0 0 631 223" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
<!-- Generator: Sketch 3.2.2 (9983) - http://www.bohemiancoding.com/sketch -->
<title>settimeout-interval</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="settimeout-interval" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
<path d="M32.5,122.5 L582.5,122.5" id="Line" stroke="#979797" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<g id="Rectangle-1-+-func(1)-+-noun_60230_cc" sketch:type="MSLayerGroup" transform="translate(48.000000, 41.000000)">
<rect id="Rectangle-1" stroke="#979797" fill="#FFFFFF" sketch:type="MSShapeGroup" x="3" y="60" width="90" height="40"></rect>
<text id="func(1)" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="25" y="84">func(1)</tspan>
</text>
<g id="noun_60230_cc" fill="#000000" sketch:type="MSShapeGroup">
<path d="M22.5818182,19.3424658 L12.9113636,16.4383562 L20.4909091,0.273972603 L0.470454545,21.0958904 L10.1931818,24 L4.28636364,39.890411 L22.5818182,19.3424658 L22.5818182,19.3424658 Z M2.19545455,20.6575342 L17.3022727,4.93150685 L11.6045455,17.0410959 L20.8568182,19.7808219 L6.9,35.6164384 L11.4477273,23.3972603 L2.19545455,20.6575342 L2.19545455,20.6575342 Z" id="Shape"></path>
</g>
<path d="M3,114.5 L3,44.5" id="Line" stroke="#373535" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
</g>
<g id="Rectangle-1-+-func(1)-+-noun_60230_cc-2" sketch:type="MSLayerGroup" transform="translate(242.000000, 41.000000)">
<rect id="Rectangle-1" stroke="#979797" fill="#FFFFFF" sketch:type="MSShapeGroup" x="3" y="60" width="90" height="40"></rect>
<text id="func(2)" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="25" y="84">func(2)</tspan>
</text>
<g id="noun_60230_cc" fill="#000000" sketch:type="MSShapeGroup">
<path d="M22.5818182,19.3424658 L12.9113636,16.4383562 L20.4909091,0.273972603 L0.470454545,21.0958904 L10.1931818,24 L4.28636364,39.890411 L22.5818182,19.3424658 L22.5818182,19.3424658 Z M2.19545455,20.6575342 L17.3022727,4.93150685 L11.6045455,17.0410959 L20.8568182,19.7808219 L6.9,35.6164384 L11.4477273,23.3972603 L2.19545455,20.6575342 L2.19545455,20.6575342 Z" id="Shape"></path>
</g>
<path d="M3,114.5 L3,44.5" id="Line" stroke="#373535" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
</g>
<g id="Rectangle-1-+-func(1)-+-noun_60230_cc-3" sketch:type="MSLayerGroup" transform="translate(436.000000, 41.000000)">
<rect id="Rectangle-1" stroke="#979797" fill="#FFFFFF" sketch:type="MSShapeGroup" x="3" y="60" width="90" height="40"></rect>
<text id="func(3)" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#000000">
<tspan x="25" y="84">func(3)</tspan>
</text>
<g id="noun_60230_cc" fill="#000000" sketch:type="MSShapeGroup">
<path d="M22.5818182,19.3424658 L12.9113636,16.4383562 L20.4909091,0.273972603 L0.470454545,21.0958904 L10.1931818,24 L4.28636364,39.890411 L22.5818182,19.3424658 L22.5818182,19.3424658 Z M2.19545455,20.6575342 L17.3022727,4.93150685 L11.6045455,17.0410959 L20.8568182,19.7808219 L6.9,35.6164384 L11.4477273,23.3972603 L2.19545455,20.6575342 L2.19545455,20.6575342 Z" id="Shape"></path>
</g>
<path d="M3,114.5 L3,44.5" id="Line" stroke="#373535" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
</g>
<text id="100" sketch:type="MSTextLayer" font-family="Consolas" font-size="18" font-weight="normal" fill="#000000">
<tspan x="179" y="201">100</tspan>
</text>
<text id="100" sketch:type="MSTextLayer" font-family="Consolas" font-size="18" font-weight="normal" fill="#000000">
<tspan x="372" y="201">100</tspan>
</text>
<path d="M142.5,122.5 L242.5,122.5" id="Line" stroke="#4990E2" stroke-width="3" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<g id="Line-3" sketch:type="MSLayerGroup" transform="translate(142.000000, 171.000000)" stroke-linecap="square" stroke="#4990E2">
<path d="M0.5,5.5 L100.5,5.5" sketch:type="MSShapeGroup"></path>
<path d="M92.5,5.5 L100.5,0.5" id="Line-5" sketch:type="MSShapeGroup" transform="translate(96.500000, 3.000000) scale(-1, 1) translate(-96.500000, -3.000000) "></path>
<path d="M0.5,10.5 L8.5,5.5" id="Line-6" sketch:type="MSShapeGroup" transform="translate(4.500000, 8.000000) scale(-1, 1) translate(-4.500000, -8.000000) "></path>
<path d="M92.5,10.5 L100.5,5.5" id="Line" sketch:type="MSShapeGroup"></path>
<path d="M0.5,5.5 L8.5,0.5" id="Line-4" sketch:type="MSShapeGroup"></path>
</g>
<g id="Line-7" sketch:type="MSLayerGroup" transform="translate(336.000000, 171.000000)" stroke="#4990E2" stroke-linecap="square">
<path d="M0.5,5.5 L100.5,5.5" id="Line-3" sketch:type="MSShapeGroup"></path>
<path d="M92.5,5.5 L100.5,0.5" id="Line-5" sketch:type="MSShapeGroup" transform="translate(96.500000, 3.000000) scale(-1, 1) translate(-96.500000, -3.000000) "></path>
<path d="M0.5,10.5 L8.5,5.5" id="Line-6" sketch:type="MSShapeGroup" transform="translate(4.500000, 8.000000) scale(-1, 1) translate(-4.500000, -8.000000) "></path>
<path d="M92.5,10.5 L100.5,5.5" id="Line" sketch:type="MSShapeGroup"></path>
<path d="M0.5,5.5 L8.5,0.5" id="Line-4" sketch:type="MSShapeGroup"></path>
</g>
<path d="M336.5,122.5 L436.5,122.5" id="Line-2" stroke="#4990E2" stroke-width="3" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
</g>
</svg>
<svg width="631" height="223" viewBox="0 0 631 223" xmlns="http://www.w3.org/2000/svg"><title>settimeout-interval</title><desc>Created with Sketch.</desc><g fill="none" fill-rule="evenodd"><path d="M32.5 122.5h550" id="Line" stroke="#979797" stroke-linecap="square"/><path stroke="#979797" fill="#fff" d="M51 101h90v40H51z"/><text font-family="Consolas" font-size="14" fill="#000" transform="translate(48 41)"><tspan x="25" y="84">func(1)</tspan></text><path d="M70.582 60.342l-9.67-2.904 7.58-16.164L48.47 62.096 58.193 65l-5.907 15.89 18.296-20.548zm-20.387 1.316l15.107-15.726-5.697 12.11 9.252 2.74L54.9 76.615l4.548-12.22-9.253-2.738z" fill="#000"/><path d="M51 155.5v-70" id="Line" stroke="#373535" stroke-width="2" stroke-linecap="square"/><path stroke="#979797" fill="#fff" d="M245 101h90v40h-90z"/><text font-family="Consolas" font-size="14" fill="#000" transform="translate(242 41)"><tspan x="25" y="84">func(2)</tspan></text><path d="M264.582 60.342l-9.67-2.904 7.58-16.164-20.022 20.822L252.193 65l-5.907 15.89 18.296-20.548zm-20.387 1.316l15.107-15.726-5.697 12.11 9.252 2.74L248.9 76.615l4.548-12.22-9.253-2.738z" fill="#000"/><path d="M245 155.5v-70" id="Line" stroke="#373535" stroke-width="2" stroke-linecap="square"/><path stroke="#979797" fill="#fff" d="M439 101h90v40h-90z"/><text font-family="Consolas" font-size="14" fill="#000" transform="translate(436 41)"><tspan x="25" y="84">func(3)</tspan></text><path d="M458.582 60.342l-9.67-2.904 7.58-16.164-20.022 20.822L446.193 65l-5.907 15.89 18.296-20.548zm-20.387 1.316l15.107-15.726-5.697 12.11 9.252 2.74L442.9 76.615l4.548-12.22-9.253-2.738z" fill="#000"/><path d="M439 155.5v-70" stroke="#373535" stroke-width="2" stroke-linecap="square"/><text font-family="Consolas" font-size="18" fill="#000"><tspan x="179" y="201">100</tspan></text><text font-family="Consolas" font-size="18" fill="#000"><tspan x="372" y="201">100</tspan></text><path d="M142.5 122.5h100" stroke="#4990E2" stroke-width="3" stroke-linecap="square"/><path d="M142.5 176.5h100m0 0l-8-5m-84 10l-8-5m92 5l8-5m-100 0l8-5M336.5 176.5h100m0 0l-8-5m-84 10l-8-5m92 5l8-5m-100 0l8-5" stroke-linecap="square" stroke="#4990E2"/><path d="M336.5 122.5h100" stroke="#4990E2" stroke-width="3" stroke-linecap="square"/></g></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 6.1 KiB

After

Width:  |  Height:  |  Size: 2.2 KiB

Before After
Before After

BIN
1-js/8-oop/2-internal-external-interface/coffee-inside.jpg
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 87 KiB

After

Width:  |  Height:  |  Size: 60 KiB

Before After
Before After