Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trial
Roman Rodionov
6,810 PointsTime of site loading
If i separate my css code by groups (Colors, Fonts, Layout etc) it will very comfortably and easy to find necessary rule:
/******************************** Colors ********************************/
body { background: #fff; }
/******************************** Fonts ********************************/
body { font-size: 1.5em; }
/******************************** Layout ********************************/
body { margin: 10px; }
But in this case i must to use one selector many times. Is it affect on the loading time of page?
3 Answers
Calvin Miracle
22,028 PointsHi Roman,
Both Chrome and Firefox, in their web developer tools, have profilers that can give you detailed breakdowns on page loading times. Perhaps other browsers and tools support these metrics, but I'm not sure about that.
So for example, in Firefox, on the page you are studying, click on Tools - Web Developer - Toggle Tools. In the tools popup, choose Network. Below the popup, choose CSS. Then reload your page. You'll see a detailed graph of how long each CSS file took to load. You can time other page types also. If you use a profiler like this while you are actually altering CSS code back at your server, you should get a pretty good idea how your code changes affect page loading times.
For your particular application, if page loading time happens to be slightly longer with your refactored code, it might not really matter. In the case you are working on, better organized code might be worth a short time penalty. This is a matter for your judgement and preference.
Was this helpful? I hope so.. Good luck, take care!
-- Calvin
Alexander Smith
2,769 PointsIt will be minimal but it can simply due to the larger file size. I'm curious as to why you plan doing it this way. Wouldn't the more traditional way of looking for what you want to modify be just as easy to keep track of? By doing it this way your basically still having to do it the traditional way on top of finding it in the category you want.
If you must do this way though I would strongly suggest minification for production preferably one line CSSO which will combine them into one block anyway.
Roman Rodionov
6,810 PointsAlexander, thank you for answer. I will learn information about CSSO more and will find the best way.
Nurul Ahsan
2,039 PointsI think loading depends on images and J query function.
Roman Rodionov
6,810 PointsRoman Rodionov
6,810 PointsThank you, Calvin! I will check page loading time and decide how to structure my code.