{"id":19,"date":"2013-01-09T13:13:24","date_gmt":"2013-01-09T13:13:24","guid":{"rendered":"http:\/\/multimedia.uoc.edu\/blogs\/htmlcss\/?p=19"},"modified":"2015-03-04T12:21:42","modified_gmt":"2015-03-04T11:21:42","slug":"rendimiento","status":"publish","type":"post","link":"https:\/\/multimedia.uoc.edu\/blogs\/htmlcss\/ca\/css\/rendimiento\/","title":{"rendered":"Rendiment"},"content":{"rendered":"<p>[Darrera edici\u00f3: 8\/9\/2014]<\/p>\n<p>Un text introductori\/motivacional sobre el tema: <a href=\"http:\/\/bradfrostweb.com\/blog\/post\/performance-as-design\/\" hreflang=\"en\">Performance As Design<\/a> (Brad Frost, 28 de gener, 2013). Una altra bona introducci\u00f3 al tema, entrant una mica m\u00e9s en detalls t\u00e8cnics, \u00e9s <a href=\"http:\/\/alistapart.com\/article\/improving-ux-through-front-end-performance\" hreflang=\"en\">Improving UX Through Front-End Performance<\/a> (<cite lang=\"en\">A List Apart<\/cite>, 12 de mar\u00e7, 2013). Un altre recurs exhaustiu \u00e9s <a href=\"https:\/\/kinsta.com\/learn\/page-speed\/\" hreflang=\"en\">A Beginner\u2019s Guide to Website Speed Optimization<\/a> (setembre, 2014).<\/p>\n<p><a href=\"http:\/\/csswizardry.com\/2013\/01\/front-end-performance-for-web-designers-and-front-end-developers\/\" hreflang=\"en\">Front-end performance for web designers and front-end developers<\/a> (Harry Roberts, 21 de gener, 2013)<\/p>\n<p><a href=\"https:\/\/speakerdeck.com\/jonrohan\/githubs-css-performance\" hreflang=\"en\">GitHub&#8217;s CSS Performance<\/a> (5 de desembre, 2012) Una presentaci\u00f3 sobre rendiment de CSS (i HTML) en llocs <em>grans<\/em> (amb milers de selectors CSS). Disposeu de l&#8217;\u00e0udio sincronitzat amb les diapositives en el seg\u00fcent v\u00eddeo:<\/p>\n<p><iframe loading=\"lazy\" title=\"GitHub&#039;s CSS Performance\" src=\"https:\/\/player.vimeo.com\/video\/54990931?dnt=1&amp;app_id=122963\" width=\"640\" height=\"480\" frameborder=\"0\" allow=\"autoplay; fullscreen; picture-in-picture; clipboard-write\"><\/iframe><\/p>\n<p><a href=\"http:\/\/www.webperformancetoday.com\/2013\/01\/31\/web-performance-101-developers\/\" hreflang=\"en\">Web Performance 101: An opinionated guide to the 22 links every developer should read<\/a> (31 de gener, 2013)<\/p>\n<p><a href=\"http:\/\/www.netmagazine.com\/tutorials\/make-your-sites-load-faster\">Make your sites load faster<\/a> (.net magazine, febrer de 2013)<\/p>\n<p><a href=\"http:\/\/browserdiet.com\/es\/\" hreflang=\"es\">C\u00f3mo perder peso en el navegador (browserdiet.com\/es)<\/a><\/p>\n<p><a href=\"http:\/\/www.webmonkey.com\/2013\/03\/put-your-site-on-a-diet-with-googles-image-shrinking-webp-format\/\" hreflang=\"en\">Put Your Site on a Diet With Google\u2019s Image-Shrinking \u2018WebP\u2019 Format<\/a> (<cite>Webmonkey<\/cite>, 13 de mar\u00e7 de 2013)<\/p>\n<p>Un bon recurs que entra en detalles t\u00e8cnics i d&#8217;implementaci\u00f3 s\u00f3n les <a href=\"http:\/\/developer.yahoo.com\/performance\/rules.html\" hreflang=\"en\">Best Practices for Speeding Up Your Web Site<\/a> de la <cite lang=\"en\">Yahoo! Developer Network<\/cite><\/p>\n<p><a title=\"Responsive Design is Not About Screen Sizes Any More\" href=\"http:\/\/speckyboy.com\/2013\/09\/11\/responsive-design-is-not-about-screen-sizes-any-more\/\" hreflang=\"en\">Responsive Design is Not About Screen Sizes Any More<\/a> (<cite>speckyboy<\/cite>, 11 de setembre de 2013)<\/p>\n<p><a title=\"Image Compression for Web Developers - HTML5 Rocks\" href=\"http:\/\/www.html5rocks.com\/en\/tutorials\/speed\/img-compression\/\" hreflang=\"en\">Image Compression for Web Developers<\/a> (<cite lang=\"en\">HTML Rocks<\/cite>, 23 de setembre de 2013)<\/p>\n<p>Una de les t\u00e8cniques que es poden utilitzar per tal d&#8217;accelerar el moment en qu\u00e8 el navegador comen\u00e7a a mostrar les p\u00e0gines (i aix\u00ed incrementar la velocitat <em>percebuda<\/em> a la qu\u00e8 es mostra la p\u00e0gina) \u00e9s incloure en l\u00ednia en la p\u00e0gina el CSS que correspon a la part superior de la p\u00e0gina i despr\u00e9s utilitzar una t\u00e8cnica anomenada <i lang=\"en\">lazy loading<\/i> per tal de carregar la resta de CSS. Aix\u00f2 s&#8217;explica amb detall a <a href=\"http:\/\/css-tricks.com\/authoring-critical-fold-css\/?scid=social28358816\" hreflang=\"en\">Authoring Critical Above-the-Fold CSS<\/a> (<cite lang=\"en\">CSS-Tricks<\/cite>, 14 de juliol de 2014). Teniu una presentaci\u00f3 sobre com ho fan al diari angl\u00e8s <cite lang=\"en\">The Guardian<\/cite> a <a href=\"https:\/\/speakerdeck.com\/patrickhamann\/breaking-news-at-1000ms-front-trends-2014\" hreflang=\"en\">https:\/\/speakerdeck.com\/patrickhamann\/breaking-news-at-1000ms-front-trends-2014<\/a> (maig de 2014).<\/p>\n<h2>Eines<\/h2>\n<ul>\n<li><a href=\"https:\/\/developers.google.com\/speed\/pagespeed\/\" hreflang=\"en\">Google PageSpeed Tools<\/a><\/li>\n<li><a href=\"http:\/\/developer.yahoo.com\/yslow\/\" hreflang=\"en\">Yahoo! YSlow<\/a><\/li>\n<li><a href=\"http:\/\/www.smushit.com\/ysmush.it\/\">Smush.it\u2122<\/a> i <a href=\"http:\/\/tinypng.org\/\" hreflang=\"en\">tinypng.org<\/a> s\u00f3n serveis web per a l&#8217;optimitzaci\u00f3 d&#8217;imatges<\/li>\n<li><a href=\"http:\/\/www.webpagetest.org\/\" hreflang=\"en\">webpagetest.org<\/a><\/li>\n<li><a href=\"http:\/\/www.sitepoint.com\/improve-page-performance-font-loader\/\" hreflang=\"en\">How to Improve Page Performance with a Font Loader<\/a><\/li>\n<\/ul>\n<p><\/p>","protected":false},"excerpt":{"rendered":"<p>[Darrera edici\u00f3: 8\/9\/2014] Un text introductori\/motivacional sobre el tema: Performance As Design (Brad Frost, 28 de gener, 2013). Una altra bona introducci\u00f3 al tema, entrant una mica m\u00e9s en detalls t\u00e8cnics, \u00e9s Improving UX Through Front-End Performance (A List Apart, 12 de mar\u00e7, 2013). Un altre recurs exhaustiu \u00e9s A Beginner\u2019s Guide to Website Speed &hellip; <\/p>\n<p class=\"link-more\"><a href=\"https:\/\/multimedia.uoc.edu\/blogs\/htmlcss\/ca\/css\/rendimiento\/\" class=\"more-link\">Continue reading<span class=\"screen-reader-text\"> &#8220;Rendiment&#8221;<\/span><\/a><\/p>\n","protected":false},"author":4,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[3,4,7],"tags":[],"class_list":["post-19","post","type-post","status-publish","format-standard","hentry","category-css","category-html","category-rendimiento","entry"],"_links":{"self":[{"href":"https:\/\/multimedia.uoc.edu\/blogs\/htmlcss\/ca\/wp-json\/wp\/v2\/posts\/19","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/multimedia.uoc.edu\/blogs\/htmlcss\/ca\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/multimedia.uoc.edu\/blogs\/htmlcss\/ca\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/multimedia.uoc.edu\/blogs\/htmlcss\/ca\/wp-json\/wp\/v2\/users\/4"}],"replies":[{"embeddable":true,"href":"https:\/\/multimedia.uoc.edu\/blogs\/htmlcss\/ca\/wp-json\/wp\/v2\/comments?post=19"}],"version-history":[{"count":35,"href":"https:\/\/multimedia.uoc.edu\/blogs\/htmlcss\/ca\/wp-json\/wp\/v2\/posts\/19\/revisions"}],"predecessor-version":[{"id":444,"href":"https:\/\/multimedia.uoc.edu\/blogs\/htmlcss\/ca\/wp-json\/wp\/v2\/posts\/19\/revisions\/444"}],"wp:attachment":[{"href":"https:\/\/multimedia.uoc.edu\/blogs\/htmlcss\/ca\/wp-json\/wp\/v2\/media?parent=19"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/multimedia.uoc.edu\/blogs\/htmlcss\/ca\/wp-json\/wp\/v2\/categories?post=19"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/multimedia.uoc.edu\/blogs\/htmlcss\/ca\/wp-json\/wp\/v2\/tags?post=19"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}