PHP Classes
elePHPant
Icontem

AMP Remove unused CSS: Remove unused CSS rules for AMP pages

Recommend this page to a friend!
  Info   View files Documentation   View files View files (2)   DownloadInstall with Composer Download .zip   Reputation   Support forum (1)   Blog    
Last Updated Ratings Unique User Downloads Download Rankings
2016-05-08 (1 year ago) RSS 2.0 feedStarStarStar 51%Total: 271 All time: 7,386 This week: 378Up
Version License PHP version Categories
amp-remove-unsed-css 1.1Freely Distributable5HTML, PHP 5, Wireless and Mobile, Per...
Collaborate with this project Author
Description

This class can be used to take away unnecessary rules within the CSS fpr AMP (Accelerated Mobile Pages).

All CSS in AMP pages is embedded inline, but some developers still use templates styles with lots of unnecessary CSS styles.

This class removes CSS rules that are not necessary or are not being used.

This process will not significantly reduce the final download size once compressed, but will add clarity to the code and will reduce the processor time, that it's useful in mobile devices.

Innovation Award
PHP Programming Innovation award nominee
May 2016
Number 14
AMP (Accelerated Mobile Pages) is a initiative to make the Web user experience for mobile device users faster and smoother and overcome the limitations of bandwidth and latency that mobile networks have.

This package helps providing a better mobile user experience by reducing the need to load excessively large CSS style sheets removing unnecessary or unneeded CSS rules, thus making the necessary CSS rules faster to load and take less device CPU resources to process.

Manuel Lemos
  Performance   Level  
Name: Marcel Soler <contact>
Classes: 1 package by
Country: Spain Spain
Age: ???
All time rank: 371897 in Spain Spain
Week rank: 1023 Up37 in Spain Spain Up
Innovation award
Innovation award
Nominee: 1x

Details

This class can be used to take away those unnecessary rules within the CSS code pages AMP (Accelerated Mobile Pages) format.

In this format each single page contain inline the whole CSS styles that will need.

Ok, all CSS in AMP is embeded inline, but some people still use templates styles with a tons of CSS code, and most of pages can add large extra useless CSS code.

It's time to reduce useless CSS and remove all those CSS rules not being used, leaving usually a few lines in each single page.

ˇNow we don't need to worry about big CSS templates that are being translated to AMP protocol!

These funcions will not significantly reduce the final download size once compressed, but will add clarity in code and will reduce the processor time, that it's useful in handheld devices.

Maybe in the future Google will mind the size of AMP pages and classify the smaller ones in a better position.

I tried some approaches to get the fastest algorithm, and now it's really fast. But I recommend to cache pages as usual.

More information about AMP: https://www.ampproject.org/

HOW TO USE THE CLASS

First include the file amp_remove_css.class.php

HOW TO USE - BASIC:

$tmp = new AmpRemoveUnusedCss();
$tmp->process($htmlcode);  //must be full htmlcode, with <style amp-custom> tag and the <body> content
echo $tmp->result();		

HOW TO VIEW REPORT:

$tmp = new AmpRemoveUnusedCss(1);  //set 1 or TRUE to get full report, or void or 0 or FALSE to get simple report
$tmp->process($htmlcode);  
echo $tmp->report(); 

ONLY MINIFY CSS (can be used in no-AMP pages, too)

You also can just only minify CSS by calling (it removes useless white spaces, but it does not remove unused CSS rules):

$tmp = new AmpRemoveUnusedCss();
$css_minified = $tmp->minify($css);	

  Files folder image Files  
File Role Description
Plain text file amp_remove_css.class.php Class Class source
Accessible without login Plain text file README.md Doc. Documentation

 Version Control Unique User Downloads Download Rankings  
 100%
Total:271
This week:0
All time:7,386
This week:378Up
User Ratings User Comments (1)
 All time
Utility:75%StarStarStarStar
Consistency:75%StarStarStarStar
Documentation:66%StarStarStarStar
Examples:-
Tests:-
Videos:-
Overall:51%StarStarStar
Rank:2132