Browsing by Subject "css"

Web development is in great demand these days. Constantly developing technologies enables to create impressive websites and mitigates the amount of development work. However, it is useful to consider the performance aspect, which affects directly to user experience. Performance in this context means website’s load times. Front end web development typically involves using Cascading Style Sheets (CSS) which is a style sheet language and a web technology that is used to describe the visual presentation of a website. This research consist of a literature review part, which contains background knowledge about how web browsers work, performance in general, performance metrics along with CSS performance optimization and an empirical part, which includes different benchmarks presented in major software industry conferences for testing the performance of a certain CSS feature, that have a possibility to improve the performance of the website. The loading times obtained from the benchmarks are reviewed and compared with each other. In addition, a few techniques are presented that do not have their own benchmark, but which may have an effect on performance. To highlight the results, CSS performance is usually not the biggest bottleneck of performance on a website, since the overall style calculation takes about a quarter of the total runtime calculation on average. However, utilizing some particular techniques and managing to shrink the style calculation costs can be valuable. Based on the benchmarks on this research, using shadow DOM and scoped styles have a positive effect on style performance. For layout, performance benefits can be achieved by utilizing CSS containment and concurrent rendering. From other practices, it can be concluded that removing unused CSS, avoiding reflow and repaint along with complex selectors and considering the usage of web fonts a better results can be achieved in terms of performance.