CODEWITHSUNDEEP
phpjavascripthtmlcssperformance
Jitendra Vyas
Jitendra Vyas

Reputation: 152875

How to optimize html, css runtime on server for better loading time?

Many times I have read on many question's answers that we don't need to remove white-space and comments from html, css and js files to reduce file size manually We can do this automatically on server.

1) Is it like in my dreamweaver it will be like this

/*Some Comment*/
.footer li h3 {
    margin: 0 0 6px;
    font-weight: bold;
    display: inline;
    color: #e92e2e; }
/*Some comment*/
    .footer li h3 a {
        font-weight: normal;
        font-size: 1em;
        color: #e92e2e; }

On server it will be this ?

.footer li h3{margin:0 0 6px;font-weight:bold;display:inline;color:#e92e2e}.footer li h3 a{font-weight:normal;font-size:1em;color:#e92e2e}

I can do this by hand or using this tool http://www.refresh-sf.com/yui/

2) How to do this on Lamp server?

3) On server do we just remove white space and comments?

Upvotes: 1

Views: 578

Answers (3)

rebz
rebz

Reputation: 2113

If that's how your CSS file looks in Dreamweaver, it will display the same for anyone else (even if they open it in Notepad).

In order to reduce file sizes you should minify your code. There are several tools/compilers/sites that will do it for you. Below are three well-known sites/tools for compression.

Something else you may want to take into consideration is caching your sites. Hope this helps!

Upvotes: 1

Mike
Mike

Reputation: 24413

If you want to remove white space on runtime, you could use PHP to serve the CSS:

<?php
$lines = file('yourCssFile.css');
$content = '';
foreach ($lines as $line_num => $line) {
    $content .= trim($line);
}
header("Content-type: text/plain"); // <-- change accordingly

echo $content;

Then you would just link to the php file in your html instead. You can do similarly for html, js and css. Of course, the effect that this will have on the overall speed will be minimal. Using gzip compression will be far better.

Upvotes: 1

Uzair
Uzair

Reputation: 135

You need a minifying tool. Try googling yuicompressor and go through its docs. You will need to create an Ant script to automate this.

Upvotes: 1

Related Questions