PROG_WAY_BLOG Telegram 194
progway — программирование, IT
CSS можно в JS и это не всегда хорошо​ Фронтендеры как будто не могут договориться как им хочется писать стили 🙂. Вариантов очень много, разнообразных препроцессоров и инструментов в виде библиотек стилей, CSS фреймворков… Вообще, CSS-in-JS — это некоторый…
К слову, о разности в производительности: вот наглядный пример разницы времени скриптинга.

Тут видно, что нативный подход примерно на 20 миллисекунд быстрее, чем styled-components, и, возможно, вы можете подумать, что эта разница слишком мала. Только вот эта разница достигается уже тогда, когда я рендерю просто 5 div со стилями на странице, а стилизованных компонентов даже в маленьких проектах значительно больше пяти.

Из практики, на одном из больших проектов, где за стандарт был взят styled-components, время скриптинга одного из модулей доходило до 3.5 секунд. После переписывания стилей на CSS-модули, время скриптинга уменьшилось до 650-700мс, то есть, по факту, в 5 раз, просто из-за стилей в коде 🤷‍♂️

В примере выше значение в 20мс не является погрешностью измерения. Я специально покрутил страницу подольше и взял усредненные значения. Если экстраполировать эти значения, то, в среднем, если 5 styled-components компонентов замедлят вашу страницу на 20мс, то в более реальной ситуации с 100-200 компонентами, ваша страница из-за стилей будет грузиться на 400-800мс дольше.

Даже если сделать скидку на погрешность измерения и сократить ожидаемую деградацию в два раза до 200-400мс, то даже это не спасёт ситуацию. Это всё равно очень большое время 🤷‍♂️🤷‍♂️🤷‍♂️
Please open Telegram to view this post
VIEW IN TELEGRAM
👍31🤯52🐳2🤪1🗿1



tgoop.com/prog_way_blog/194
Create:
Last Update:

К слову, о разности в производительности: вот наглядный пример разницы времени скриптинга.

Тут видно, что нативный подход примерно на 20 миллисекунд быстрее, чем styled-components, и, возможно, вы можете подумать, что эта разница слишком мала. Только вот эта разница достигается уже тогда, когда я рендерю просто 5 div со стилями на странице, а стилизованных компонентов даже в маленьких проектах значительно больше пяти.

Из практики, на одном из больших проектов, где за стандарт был взят styled-components, время скриптинга одного из модулей доходило до 3.5 секунд. После переписывания стилей на CSS-модули, время скриптинга уменьшилось до 650-700мс, то есть, по факту, в 5 раз, просто из-за стилей в коде 🤷‍♂️

В примере выше значение в 20мс не является погрешностью измерения. Я специально покрутил страницу подольше и взял усредненные значения. Если экстраполировать эти значения, то, в среднем, если 5 styled-components компонентов замедлят вашу страницу на 20мс, то в более реальной ситуации с 100-200 компонентами, ваша страница из-за стилей будет грузиться на 400-800мс дольше.

Даже если сделать скидку на погрешность измерения и сократить ожидаемую деградацию в два раза до 200-400мс, то даже это не спасёт ситуацию. Это всё равно очень большое время 🤷‍♂️🤷‍♂️🤷‍♂️

BY progway — программирование, IT




Share with your friend now:
tgoop.com/prog_way_blog/194

View MORE
Open in Telegram


Telegram News

Date: |

Other crimes that the SUCK Channel incited under Ng’s watch included using corrosive chemicals to make explosives and causing grievous bodily harm with intent. The court also found Ng responsible for calling on people to assist protesters who clashed violently with police at several universities in November 2019. Your posting frequency depends on the topic of your channel. If you have a news channel, it’s OK to publish new content every day (or even every hour). For other industries, stick with 2-3 large posts a week. Informative Hui said the time period and nature of some offences “overlapped” and thus their prison terms could be served concurrently. The judge ordered Ng to be jailed for a total of six years and six months. fire bomb molotov November 18 Dylan Hollingsworth yau ma tei
from us


Telegram progway — программирование, IT
FROM American