How can I minimize HTML for performance using PHP

Question

I'm somewhat new to the concept of minimization, but it seems simple enough. I understand how libraries like jQuery can benefit from minimization, but my question is whether or not it should be extended to HTML and CSS (I've seen CSS resets minimize code, so perhaps the increase in performance has been measured).

First, I have no idea how to measure the increased performance, but I was wondering if any of you had any knowledge or experience about the magnitude of performance increase one could expect when minimizing HTML and CSS code (substantial, negligible, etc).

Finally, I know HTML and especially XHTML should be as readable as possible to whoever maintains the code, which why I was thinking it would be best to minimize this code at the time of rendering only, with PHP. If this is viable, what is the best way of doing this? Just trimming the HTML and CSS ($html = trim($html);)?

trim() deletes only spaces from start and end. Therefore, useless in the case of minimization. — Shikiryu
– Shikiryu, Commented May 13, 2012 at 15:33
I work for a website that gets millions of page hits a month, we don't bother minimizing html. If you're near Google levels of traffic it might be worth it but until then you might want to try and figure out better uses of your time. — JaredMcAteer
– JaredMcAteer, Commented May 13, 2012 at 15:34

Community · Accepted Answer · 2020-06-20 09:12:55Z

2

Yahoo has some high performance website rules. I have quoted some of the rules. Read it carefully. These rules answers your question.

The time it takes to transfer an HTTP request and response across the network can be significantly reduced by decisions made by front-end engineers. It's true that the end-user's bandwidth speed, Internet service provider, proximity to peering exchange points, etc. are beyond the control of the development team. But there are other variables that affect response times. Compression reduces response times by reducing the size of the HTTP response.

Minification is the practice of removing unnecessary characters from code to reduce its size thereby improving load times. When code is minified all comments are removed, as well as unneeded white space characters (space, newline, and tab). In the case of JavaScript, this improves response time performance because the size of the downloaded file is reduced. Two popular tools for minifying JavaScript code are JSMin and YUI Compressor. The YUI compressor can also minify CSS.

So minimizing any content thats going to be transferred over HTTP reduces transfer time. Hence gives a head start on rendering. So your website performs faster. If you enable compression, site performance improvement will be noticeable. Also if you compress and minify Javascript, HTML and CSS all things will be faster.

edited Jun 20, 2020 at 9:12

CommunityBot

11 silver badge

answered May 13, 2012 at 15:52

Shiplu Mokaddim

57.5k20 gold badges147 silver badges193 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Michael Durrant Over a year ago

OP knows that smaller is faster so I feel that this is not an answer.

Shiplu Mokaddim Over a year ago

@MichaelDurrant Yes he knows it. But his question regarding HTML and CSS is in my answer. As it was not noticeable earlier I put some more lines about it.

Tiago Peczenyj · Accepted Answer · 2012-05-13 15:35:22Z

1

To measure performance in this case you can use some tool like YSlow (in firefox > firebug) or the Profile tab in Chrome inspector.

There are many things to do to speed up a webpage. If you have many small images (icons) maybe it is a good idea join all in a big image and pick the correct using css. And put css and script tags in order.

answered May 13, 2012 at 15:35

Tiago Peczenyj

4,6712 gold badges24 silver badges36 bronze badges

Comments

Tusko Trush · Accepted Answer · 2013-12-05 13:14:38Z

1

<?php header('Expires: '.gmdate('D, d M Y H:i:s \G\M\T', time() + 3600));
header('Content-Type: text/html; charset=utf-8');
header("Last-Modified: " . gmdate("D, d M Y H:i:s") . " GMT");
header('X-UA-Compatible: IE=Edge,chrome=1');
function ob_html_compress($buf){
    return preg_replace(array('/<!--(?>(?!\[).)(.*)(?>(?!\]).)-->/Uis','/[[:blank:]]+/'),array('',' '),str_replace(array("\n","\r","\t"),'',$buf));
}
ob_start("ob_html_compress"); ?>
<?php // Your Code ?>
<?php ob_end_flush(); ?>

I'm using my simple php script for optimize HTML in one line

See example: http://cs.lviv.pro/

edited Dec 5, 2013 at 13:14

answered Dec 5, 2013 at 12:59

Tusko Trush

4303 silver badges15 bronze badges

Collectives™ on Stack Overflow

How can I minimize HTML for performance using PHP

3 Answers 3

2 Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related