Join James Williamson for an in-depth discussion in this video Selectors and performance, part of CSS: Selectors.
- In most cases the CSS for your site…will be contained in external resources.…Before a browser can render a page,…external style sheets must first be downloaded…and then processed.…This requirement is why CSS is referred to…as render-blocking,…and why it's important to write as efficient CSS as you can.…Since selectors play a role in the…overall performance of your CSS,…let's take a look at how browsers parse selectors,…and how they impact performance.…When painting an element on the page,…browser must identify all styles that apply to it.…
In many cases this means evaluating selectors…to see if there's a match for that specific element,…and this is where things get a little tricky.…You see, selectors are read by the browser…from right to left, not left to right…the way that we read them.…So, in the case of a selector like this one,…article p,…the browser is gonna first ask…if the element is a paragraph,…and only then is it going to evaluate…whether any of its ancestors is an article or not.…As you can imagine, the more complex a selector is,…
- Targeting classes and IDs
- Working with group selectors
- Targeting element attributes
- String matching
- Targeting links with pseudo-class selectors
- Targeting child elements and empty elements
- Targeting parent, child, and sibling elements
- Matching patterns
- Writing efficient selectors
Skill Level Intermediate
CSS: Advanced Typographic Techniqueswith James Williamson3h 14m Intermediate
HTML5: Graphics and Animation with Canvaswith Joe Marini3h 7m Intermediate
1. Basic Selectors
2. Attribute Selectors
3. User Action Pseudo-Class Selectors
4. Structural Selectors
6. Matching Patterns
7. Writing Efficient Selectors
- Mark as unwatched
- Mark all as unwatched
Are you sure you want to mark all the videos in this course as unwatched?
This will not affect your course history, your reports, or your certificates of completion for this course.Cancel
Take notes with your new membership!
Type in the entry box, then click Enter to save your note.
1:30Press on any video thumbnail to jump immediately to the timecode shown.
Notes are saved with you account but can also be exported as plain text, MS Word, PDF, Google Doc, or Evernote.