There are a lot of guides on performance optimization for front-end developers, but this one is really the definitive front-end performance guide. Includes guides and examples on best practices for HTML, CSS, JavaScript, jQuery, Images and Server. There are also links for useful tools about front-end performance.
Learn CSS Layout
This link teaches all the CSS fundamentals that you should know when dealing with CSS layouts.
It is the most comprehensive tutorial on this topic containing short descriptions, code examples and further links for display, box-sizing, position, float, clear, CSS3 column, flex-box and media queries.
CSS performance at GitHub
Detailed slideshow about GitHubs CSS performance. With examples of low performance CSS selectors and tips on how to remove unnecessary HTML tags to reduce HTML DOM matches. Includes also slides about teamwork and layout performance monitoring tools.
Even though leaner CSS is always good for performance and maintenance this article focuses mainly on pages with heavy HTML DOM.
jQuery performance tips
Selection of proven performance tips and tricks for jQuery, including tips for performance measuring tools like jsperf, faster selectors, traversing the DOM, variable caching, events, dom manipulation, loops and DRY code.
It’s a must read for everybody who uses jQuery. After reading you will definitely write faster and more performant DRY code.
http://www.slideshare.net/AddyOsmani/jquery-proven-performance-tips-tricks
ZURB Foundation
Responsive front-end-framework for intuitive web development. Supports mobiles, tablets and modern browsers back to IE8. Comes with some jQuery plugins for slideshows, modals, etc. It’s build with SASS.
Twitter Bootstrap
Powerful adaptive front-end-framework for intuitive web development. Built for desktop browsers (incl. IE7), tablets and mobiles. Comes with a lot of jQuery plugins for UI interactions. It’s build with LESS.