Results 1 to 6 of 6

Thread: Does Text-Shadow, Box-Shadow, Border-Radius Affect Page Loading Speed?

Hybrid View

  1. #1
    Join Date
    May 2014

    Does Text-Shadow, Box-Shadow, Border-Radius Affect Page Loading Speed?


    If I use too much of text-shadow, box-shadow and border-radius in the CSS, will it somehow increase the loading time of the website?

    Thanks in advance.

  2. #2
    Join Date
    Dec 2002
    Seattle, WA
    There is "loading time", the time that it take to finish initializing. And there is "rendering time", the time it take to draw a resource on screen.
    Rendering will affect the perceived loading time (e.g. loading and rendering).
    Drawing shadows should only have a minor effect on rendering.
    Things like resources (i.e. stylesheets, javascript, images, fonts, etc.) effect rending and loading more so, especially if they are cross-domain resources.

  3. #3
    Join Date
    May 2014
    Ok thank you.

  4. #4
    Really it's not as significant an impact on a 'modern' system, at least not compared to parsing markup and CSS. If you are conerned about speed there are a LOT better places to put the efforts than worrying about CSS3 effects... EXCEPT:

    For linear-gradient. Linear gradient is generated as an actual image before it is applied in most browsers, instead of being tiled or applied in realtime. This can REALLY bite you in the backside on memory use and render time if you use it on LARGE elements (like body). Firefox in particular is disastrously poor performing on CSS3 effects, though it's made great strides since version 27 dropped.

    It's actually a laugh that rounded corners (fancy math) and box-shadow (blending effects) are better performing than a simple linear-gradient (bi-directional Bresenham Algo)... but those other two are done in the render path, linear-gradient is actually implemented as a background-image, meaning it is built BEFORE rendering starts.

    Which is why I'm still using a background-image instead, and using background-size to scale it up.

  5. #5
    Join Date
    May 2014
    Yeah I too don't use linear-gradients.

  6. #6
    Join Date
    Sep 2006
    new york
    That's helpful info. Thanks.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
HTML5 Development Center