Valentin Petkov Valentin Petkov - 6 months ago 23
CSS Question

CSS Minimize and compress on fly

I would like to ask how this works.

when I load this file I see from chrome dev tool / Network tab 151kb
https://cdnjs.cloudflare.com/ajax/libs/bootstrap-material-design/0.3.0/css/material-fullpalette.min.css

actually with other tool the actual size is 2,111,460 bytes ~2MB

if I want to host by myself this file what are the steps to replicate same result as cloudflare?

I can not afford 2MB per unique user I would like to keep it 151kb

question 2
What is the role of last:
/*# sourceMappingURL=material-fullpalette.min.css.map */

Thanks in advance

OK thanks I paste it into CSS editor and I saw what I am getting is the full version obviously this is cumming from this MAP file the compress file is 151k
Thanks Andrew

P.S.
I wander who downgrade my question to tell me why?

Answer

If I want to host by myself this file what are the steps to replicate same result as cloudflare?

You can't unless you have top-notch servers in different parts of the world ready to deliver content to users via a server nearest to them (that is how CloudFlare and other CDN providers provide content faster than your server btw).


What is the role of last: /*# sourceMappingURL=material-fullpalette.min.css.map */

Those .map files called source maps, and are used by browser debuggers to display compiled CSS (LESS,SASS, etc) in a readable format.