1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

More than 1 000 lines in my extra.css, will this affect load time ?

Discussion in 'XenForo Questions and Support' started by account8226, Apr 6, 2013.

  1. account8226

    account8226 Guest


    After making some changes to one of my theme, I now have more than 1 000 lines in my extra.css file (it's a lot, but I've not made any other template edits except from style's editor's).

    I'm afraid all of these lines affect my site speed, what is your opinion about that ?
  2. Brogan

    Brogan XenForo Moderator Staff Member

    account8226 likes this.
  3. Shelley

    Shelley Well-Known Member

    I think your site will be fine I have probably twice as much as that residing in my EXTRA.CSS and notice zero slowing
    account8226 likes this.
  4. account8226

    account8226 Guest

    Amazing! That's cool I can go on making my theme more personal without anu restriction, that was the only thing I was afraid of!

    Have you got a new website Shelley ? I really love how your webdesign is.
  5. TheJoker

    TheJoker Member

    Logic tells me that even if it is a small decrease in performance, there has to be one, but if Brogan says no, then he's probably right. :)
  6. Shelley

    Shelley Well-Known Member

    Site I've always had atleast for the past 4 years is in my signature. Just the same ole smiley site. :)
    account8226 likes this.
  7. Teapot

    Teapot Well-Known Member

    Basically: On really slow browsers, your page may be rendered slightly more slowly due to the extra CSS it needs to parse. It will also make your CSS files slightly bigger in file size. Both of these things are minuscule, though, and not worth worrying about. I am personally extremely OCD and like to keep my CSS as compact as possible, but in the real world it's not necessary at all unless you've got a massive, massive site and the extra kilobytes of bandwidth would make a big difference to you. If that were the case, you'd already know :)
    account8226 likes this.
  8. account8226

    account8226 Guest

    Ok I understand, thanks for the clear awnser, so we can make our styles without to worry about this :D
  9. Russ

    Russ Well-Known Member

    Best practice stick to style properties as much as possible, if you can't change something through them, go to extra.css (y)
    account8226 likes this.
  10. account8226

    account8226 Guest

    Yes I agree with you, since you won't have to load member's view css on a thread ^^
  11. Hoffi

    Hoffi Well-Known Member

    Putting all into extra.css creates a hughe overload of possible unneccesary CSS code on many pages. It's a way, but not a good way.

    I have less than 100 Lines in my extra.css - I change most in Style-Properties, added new style properties with an addon. Changed some classes with TMS. Updates are no Problem, and the code will stay clear.

    So much lines in ons CSS is very dirty coding. And yes, it will effect the load time for the first visit. It slows down the render time in slow browsers and on mobile devices.
    Luxus and xf_phantom like this.
  12. Russ

    Russ Well-Known Member

    The more you get in-depth the more you'll find style properties are limited. Don't get me wrong... style properties are amazing... but they could be improved that's for sure.
    account8226 likes this.
  13. account8226

    account8226 Guest

    What add-on allow you to add more style propreties ? Custom one ?
  14. account8226

    account8226 Guest

    How many extra.css lines are their in your fusion gamer theme ?
  15. Teapot

    Teapot Well-Known Member

    In debug mode, you can create new style properties and assign them to either a style or an add-on. It won't really help make EXTRA.css a great deal smaller - you just move the code elsewhere - but it does make things much easier for non-technical users who want to customise your style. For example, in one of my styles I had a background that could change colour via CSS and a pattern. I created a style property to control that colour, so people didn't have to dig around in the CSS to change it. Although the code for it is still in the CSS files and thus has no performance/filesize benefit, I can use XenForo's excellent template syntax to make things a lot easier on the end user.

    I wouldn't worry about this too much, though :)
    Shelley and account8226 like this.
  16. account8226

    account8226 Guest

    Thanks for the help, yes I don't have the time to create such custom style proprieties ^^
  17. Shelley

    Shelley Well-Known Member

    If it's just you modifying the style it's easier throwing it in EXTRA. I personally find dealing with the style properties time consuming and only use it if I have to.
  18. Luxus

    Luxus Well-Known Member

    Exactly why I stick to use TMS and style properties.
    @OP: If you have finished your site, you can use digitalpoint's CSS Compressor or any Compressor to save some KBs. Although I recommend making a backup of your uncompressed EXTRA.css as it's a pain to manage a compressed CSS file.

Share This Page