pezkuwichain/pezkuwi-telemetry
1
0
Fork 0
mirror of https://github.com/pezkuwichain/pezkuwi-telemetry.git synced 2026-06-19 00:41:11 +00:00
Code Issues Packages Projects Releases Wiki Activity

Turbo Render (#298)

Browse Source 
* More responsive React updates on scroll

* `Icon`s now use shadow dom

* Faster Sparkline

* Recycle table rows

* Separate Header from Chain to avoid vdom diffing

* Separate THead from Row.HEADER to avoid vdom diffing

* Throttle rendering updates on chain tabs, also styles

* Minor tweaks and fixes

* Created components for all columns

* Wrapping up Column refactor

* Rename Row--td to Column

* Lazy `Ago`

* Update styles for faster layouting

* Minor cleanup

* Fix Connection

* Use shadow DOM in `PolkadotIcon`

* Comments and tweaks for the List component

* Faster Tooltip and Truncate

* Minor tweaks

* Tooltiped columns can now be copied

* Future-proof Connection

* Remove the <div> wrapper from Icon

* Fix dash on missing graph data

* Clean up some SVGs

* Cleanup and comments

* Localize the use of `previousKeys` to `recalculateKeys`

* Custom appState disjoint from React component state

* Make appState and appUpdate refs readonly

* Cleanup
This commit is contained in:
Maciej Hirsz
2020-11-11 13:41:01 +01:00
committed by GitHub
parent 675776c3e1
commit ebb01c1a7d
72 changed files with 1863 additions and 1118 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/icons/crab.svg
+3 -6
View File
File diff suppressed because one or more lines are too long
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 5.6 KiB

After

Width:  |  Height:  |  Size: 5.5 KiB

frontend/src/icons/darwinia.svg
+3 -6
View File
@@ -1,9 +1,6 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="512px" height="512px" viewBox="0 0 512 512" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 64 (93537) - https://sketch.com -->
<title>Darwinia</title>
<desc>Darwinia Network Logo</desc>
<g id="Darwinia" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<path d="M113.288481,145 C128.136677,145 140.174312,157.023943 140.174312,171.856735 C140.174312,183.469807 132.793886,193.362319 122.463232,197.108867 L122.464671,336.232914 C141.696857,335.384773 159.580699,331.869555 175.47006,326.043141 L175.46949,219.38341 C165.138836,215.636862 157.75841,205.744351 157.75841,194.131279 C157.75841,179.298487 169.796045,167.274543 184.644241,167.274543 C199.492436,167.274543 211.530071,179.298487 211.530071,194.131279 C211.530071,205.744351 204.149645,215.636862 193.818991,219.38341 L193.819851,317.813403 C211.486095,308.273137 225.639172,295.360902 235.02445,279.767728 C228.656572,274.035269 224.654434,265.734349 224.654434,256.5 C224.654434,239.206326 238.688237,225.188356 256,225.188356 C257.421586,225.188356 258.821069,225.282882 260.192492,225.465984 C284.066647,183.99976 335.257967,158.88464 396.335714,158.249774 L398.711519,158.237443 L496.825688,158.237443 C501.892521,158.237443 506,162.340477 506,167.401826 C506,172.282413 502.180673,176.271914 497.364749,176.550653 L496.825688,176.56621 L479.24159,176.56621 L479.242252,315.890998 C489.573026,319.637265 496.953109,329.529235 496.953109,341.143265 C496.953109,355.974833 484.914915,368 470.067278,368 C455.219642,368 443.181448,355.974833 443.181448,341.143265 C443.181448,329.528083 450.562994,319.635304 460.895378,315.889884 L460.892966,176.56621 L407.883792,176.56621 L407.886493,315.890998 C418.217267,319.637265 425.59735,329.529235 425.59735,341.143265 C425.59735,355.974833 413.559155,368 398.711519,368 C383.863882,368 371.825688,355.974833 371.825688,341.143265 C371.825688,329.529235 379.205771,319.637265 389.536545,315.890998 L389.535329,176.767086 C370.303143,177.615227 352.419301,181.130445 336.52994,186.956859 L336.530733,293.616455 C346.861507,297.362722 354.24159,307.254692 354.24159,318.868721 C354.24159,333.70029 342.203396,345.725457 327.355759,345.725457 C312.508123,345.725457 300.469929,333.70029 300.469929,318.868721 C300.469929,307.254692 307.850012,297.362722 318.180786,293.616455 L318.180149,195.186597 C300.513905,204.726863 286.360828,217.639098 276.97555,233.232272 C283.34359,238.964127 287.345566,247.265003 287.345566,256.5 C287.345566,273.79246 273.311194,287.811644 256,287.811644 C254.57846,287.811644 253.179017,287.71711 251.807626,287.533993 C227.933663,329.000088 176.742218,354.115358 115.664286,354.750226 L113.288481,354.762557 L15.1743119,354.762557 C10.1074794,354.762557 6,350.659523 6,345.598174 C6,340.717587 9.81932711,336.728086 14.6352514,336.449347 L15.1743119,336.43379 L32.7584098,336.432772 L32.7584368,197.109036 C22.4275387,193.362616 15.0468909,183.469982 15.0468909,171.856735 C15.0468909,157.023943 27.0845259,145 41.9327217,145 C56.7809176,145 68.8185525,157.023943 68.8185525,171.856735 C68.8185525,183.468835 61.439362,193.360663 51.1100663,197.107926 L51.1070336,336.432772 L104.11315,336.432772 L104.113731,197.108867 C93.7830763,193.362319 86.4026504,183.469807 86.4026504,171.856735 C86.4026504,157.023943 98.4402853,145 113.288481,145 Z" id="Darwinia" fill="currentColor"></path>
<svg width="512" height="512" viewBox="0 0 512 512" version="1.1" xmlns="http://www.w3.org/2000/svg">
<g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<path d="M113.288481,145 C128.136677,145 140.174312,157.023943 140.174312,171.856735 C140.174312,183.469807 132.793886,193.362319 122.463232,197.108867 L122.464671,336.232914 C141.696857,335.384773 159.580699,331.869555 175.47006,326.043141 L175.46949,219.38341 C165.138836,215.636862 157.75841,205.744351 157.75841,194.131279 C157.75841,179.298487 169.796045,167.274543 184.644241,167.274543 C199.492436,167.274543 211.530071,179.298487 211.530071,194.131279 C211.530071,205.744351 204.149645,215.636862 193.818991,219.38341 L193.819851,317.813403 C211.486095,308.273137 225.639172,295.360902 235.02445,279.767728 C228.656572,274.035269 224.654434,265.734349 224.654434,256.5 C224.654434,239.206326 238.688237,225.188356 256,225.188356 C257.421586,225.188356 258.821069,225.282882 260.192492,225.465984 C284.066647,183.99976 335.257967,158.88464 396.335714,158.249774 L398.711519,158.237443 L496.825688,158.237443 C501.892521,158.237443 506,162.340477 506,167.401826 C506,172.282413 502.180673,176.271914 497.364749,176.550653 L496.825688,176.56621 L479.24159,176.56621 L479.242252,315.890998 C489.573026,319.637265 496.953109,329.529235 496.953109,341.143265 C496.953109,355.974833 484.914915,368 470.067278,368 C455.219642,368 443.181448,355.974833 443.181448,341.143265 C443.181448,329.528083 450.562994,319.635304 460.895378,315.889884 L460.892966,176.56621 L407.883792,176.56621 L407.886493,315.890998 C418.217267,319.637265 425.59735,329.529235 425.59735,341.143265 C425.59735,355.974833 413.559155,368 398.711519,368 C383.863882,368 371.825688,355.974833 371.825688,341.143265 C371.825688,329.529235 379.205771,319.637265 389.536545,315.890998 L389.535329,176.767086 C370.303143,177.615227 352.419301,181.130445 336.52994,186.956859 L336.530733,293.616455 C346.861507,297.362722 354.24159,307.254692 354.24159,318.868721 C354.24159,333.70029 342.203396,345.725457 327.355759,345.725457 C312.508123,345.725457 300.469929,333.70029 300.469929,318.868721 C300.469929,307.254692 307.850012,297.362722 318.180786,293.616455 L318.180149,195.186597 C300.513905,204.726863 286.360828,217.639098 276.97555,233.232272 C283.34359,238.964127 287.345566,247.265003 287.345566,256.5 C287.345566,273.79246 273.311194,287.811644 256,287.811644 C254.57846,287.811644 253.179017,287.71711 251.807626,287.533993 C227.933663,329.000088 176.742218,354.115358 115.664286,354.750226 L113.288481,354.762557 L15.1743119,354.762557 C10.1074794,354.762557 6,350.659523 6,345.598174 C6,340.717587 9.81932711,336.728086 14.6352514,336.449347 L15.1743119,336.43379 L32.7584098,336.432772 L32.7584368,197.109036 C22.4275387,193.362616 15.0468909,183.469982 15.0468909,171.856735 C15.0468909,157.023943 27.0845259,145 41.9327217,145 C56.7809176,145 68.8185525,157.023943 68.8185525,171.856735 C68.8185525,183.468835 61.439362,193.360663 51.1100663,197.107926 L51.1070336,336.432772 L104.11315,336.432772 L104.113731,197.108867 C93.7830763,193.362319 86.4026504,183.469807 86.4026504,171.856735 C86.4026504,157.023943 98.4402853,145 113.288481,145 Z" fill="currentColor"></path>
</g>
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3.4 KiB

After

Width:  |  Height:  |  Size: 3.2 KiB

frontend/src/icons/edgeware.svg
+6 -6
View File
@@ -1,10 +1,10 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="200px" height="200px" viewBox="0 0 200 200" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<g id="Artboard" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="square">
<g id="Group" transform="translate(48.000000, 40.000000)" stroke="currentColor" stroke-width="22">
<path d="M52.5,0.5 L52.5,120.5" id="Line"></path>
<path d="M52.5,0.5 L52.5,120.5" id="Line" transform="translate(52.500000, 60.500000) rotate(60.000000) translate(-52.500000, -60.500000) "></path>
<path d="M52.5,0.5 L52.5,120.5" id="Line" transform="translate(52.500000, 60.500000) rotate(-60.000000) translate(-52.500000, -60.500000) "></path>
<svg width="200" height="200" viewBox="0 0 200 200" version="1.1" xmlns="http://www.w3.org/2000/svg">
<g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="square">
<g transform="translate(48.000000, 40.000000)" stroke="currentColor" stroke-width="22">
<path d="M52.5,0.5 L52.5,120.5"></path>
<path d="M52.5,0.5 L52.5,120.5" transform="translate(52.500000, 60.500000) rotate(60.000000) translate(-52.500000, -60.500000) "></path>
<path d="M52.5,0.5 L52.5,120.5" transform="translate(52.500000, 60.500000) rotate(-60.000000) translate(-52.500000, -60.500000) "></path>
</g>
</g>
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 814 B

After

Width:  |  Height:  |  Size: 712 B

frontend/src/icons/polkadot-js.svg
+1 -1
View File
@@ -1 +1 @@
<?xml version="1.0" encoding="iso-8859-1" standalone="yes"?><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" id="polkadot-js" x="0" y="0" viewBox="0 0 512 512" style="enable-background:new 0 0 512 512;zoom: 1;" xml:space="preserve"><circle style="fill:currentColor;opacity:0.25" cx="256" cy="256" r="200"></circle><rect stroke="currentColor" height="400" x="80" stroke-width="0" width="400" y="48" fill="none" transform=""></rect><path style="fill:currentColor;" d="M391.05,232.97 c-7.125,-20.664 -36.341,-20.664 -42.04,-3.563 c-5.7,17.101 13.539,27.076 43.466,37.053 c29.927,9.976 48.454,36.341 44.891,59.854 s-13.539,54.154 -72.68,54.154 c-36.963,0 -57.505,-23.103 -67.714,-40.429 l33.511,-20.138 c0,0 11.401,24.227 32.777,24.227 c21.377,0 29.927,-7.125 29.927,-23.514 c0,-19.951 -69.118,-27.076 -79.806,-61.279 s3.563,-82.656 53.441,-79.094 c31.175,2.227 48.71,17.535 57.478,28.703 L391.05,232.97 z " visibility="visible"></path><path style="fill:currentColor;" d="M235.714,183.805 c0,0 0,120.421 0,136.81 c0,16.388 -14.251,24.94 -28.502,22.089 c-14.251,-2.85 -20.664,-19.951 -20.664,-19.951 l-32.777,22.089 c0,0 7.125,32.777 52.016,35.628 c44.891,2.85 70.542,-24.227 70.542,-47.029 s0,-149.636 0,-149.636 L235.714,183.805 L235.714,183.805 z " visibility="visible"></path><circle style="fill:currentColor;" cx="90" cy="180" r="64"></circle></svg>
<?xml version="1.0" encoding="iso-8859-1" standalone="yes"?><svg xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 512 512"><circle style="fill:currentColor;opacity:0.25" cx="256" cy="256" r="200"></circle><rect stroke="currentColor" height="400" x="80" stroke-width="0" width="400" y="48" fill="none" transform=""></rect><path style="fill:currentColor;" d="M391.05,232.97 c-7.125,-20.664 -36.341,-20.664 -42.04,-3.563 c-5.7,17.101 13.539,27.076 43.466,37.053 c29.927,9.976 48.454,36.341 44.891,59.854 s-13.539,54.154 -72.68,54.154 c-36.963,0 -57.505,-23.103 -67.714,-40.429 l33.511,-20.138 c0,0 11.401,24.227 32.777,24.227 c21.377,0 29.927,-7.125 29.927,-23.514 c0,-19.951 -69.118,-27.076 -79.806,-61.279 s3.563,-82.656 53.441,-79.094 c31.175,2.227 48.71,17.535 57.478,28.703 L391.05,232.97 z " visibility="visible"></path><path style="fill:currentColor;" d="M235.714,183.805 c0,0 0,120.421 0,136.81 c0,16.388 -14.251,24.94 -28.502,22.089 c-14.251,-2.85 -20.664,-19.951 -20.664,-19.951 l-32.777,22.089 c0,0 7.125,32.777 52.016,35.628 c44.891,2.85 70.542,-24.227 70.542,-47.029 s0,-149.636 0,-149.636 L235.714,183.805 L235.714,183.805 z " visibility="visible"></path><circle style="fill:currentColor;" cx="90" cy="180" r="64"></circle></svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.4 KiB

After

Width:  |  Height:  |  Size: 1.2 KiB