Adding TOC #21

Closed
szepeviktor opened this Issue Oct 9, 2015 · 5 comments

Comments

2 participants
@szepeviktor
Contributor

szepeviktor commented Oct 9, 2015

What are the steps?

  1. Record TOC items in foreach($this->css as $group)
  2. Prepend TOC in $cache->cache($code,'text/css');
  3. Add an option?

Sorry. I am not familiar with AO.

@futtta futtta added the enhancement label Oct 10, 2015

@futtta

This comment has been minimized.

Show comment
Hide comment
@futtta

futtta Oct 10, 2015

Owner

well, can you first describe how a TOC would look like? simply a list of the filenames of aggregated CSS-files?

Owner

futtta commented Oct 10, 2015

well, can you first describe how a TOC would look like? simply a list of the filenames of aggregated CSS-files?

@szepeviktor

This comment has been minimized.

Show comment
Hide comment
@szepeviktor

szepeviktor Oct 10, 2015

Contributor

Yes, the idea is from https://github.com/kasparsd/minit

/* TOC
http://site.net/small.css
http://site.net/large.css
*/
Contributor

szepeviktor commented Oct 10, 2015

Yes, the idea is from https://github.com/kasparsd/minit

/* TOC
http://site.net/small.css
http://site.net/large.css
*/
@futtta

This comment has been minimized.

Show comment
Hide comment
@futtta

futtta Oct 10, 2015

Owner

in that case;

  1. create a boolean $includetoc which gets its value from apply filter "autoptimize_fitler_jscss_toc" which defaults to false
  2. in the minify function at the start you'll see code that goes through the media-types and for each mediatype gets all CSS (inline or file_get_contents-wise). if $includetoc returns true, you can create an array $toc[] to store the filenames (from var $cssPath) or "#inline" if from inline code
  3. in the "manage the @imports"-section you'll have to again add filenames to that array for every imported stylesheet
  4. you might want to also add base64'ed inlined background-images in there as well, if you want to be thorough ("// Do the imaging!")
  5. after the aggregated CSS-code has been minified, around the time the "autoptimize_css_after_minify" filter is applied, if $includetoc is true and if there is data in the $toc-array, you would insert the data from the TOC into the CSS.

and once that is done, you could create something similar for JS :-)

the rest is ... trial and error!

have fun!
frank

Owner

futtta commented Oct 10, 2015

in that case;

  1. create a boolean $includetoc which gets its value from apply filter "autoptimize_fitler_jscss_toc" which defaults to false
  2. in the minify function at the start you'll see code that goes through the media-types and for each mediatype gets all CSS (inline or file_get_contents-wise). if $includetoc returns true, you can create an array $toc[] to store the filenames (from var $cssPath) or "#inline" if from inline code
  3. in the "manage the @imports"-section you'll have to again add filenames to that array for every imported stylesheet
  4. you might want to also add base64'ed inlined background-images in there as well, if you want to be thorough ("// Do the imaging!")
  5. after the aggregated CSS-code has been minified, around the time the "autoptimize_css_after_minify" filter is applied, if $includetoc is true and if there is data in the $toc-array, you would insert the data from the TOC into the CSS.

and once that is done, you could create something similar for JS :-)

the rest is ... trial and error!

have fun!
frank

@futtta

This comment has been minimized.

Show comment
Hide comment
@futtta

futtta Mar 4, 2016

Owner

Someone asked me about this in a mail as well. I'm still not convinced this should be in AO proper, but as I wrote to that user this can easily be done using the API;

You could hook into the AO API to create a TOC if you're into that kind of things ;-)

  1. create a function to hook into autoptimize_js_individual_style
  2. in that function grab the 2nd incoming parameter and add that to a tmp string (which would be added to for each file) and return false
  3. create a 2nd function to hook into autoptimize_js_after_minify
  4. in that function add the tmp string (in between JS comment tags) to the incoming optimized JS and returning the optimized JS which now has your TOC

frank

Owner

futtta commented Mar 4, 2016

Someone asked me about this in a mail as well. I'm still not convinced this should be in AO proper, but as I wrote to that user this can easily be done using the API;

You could hook into the AO API to create a TOC if you're into that kind of things ;-)

  1. create a function to hook into autoptimize_js_individual_style
  2. in that function grab the 2nd incoming parameter and add that to a tmp string (which would be added to for each file) and return false
  3. create a 2nd function to hook into autoptimize_js_after_minify
  4. in that function add the tmp string (in between JS comment tags) to the incoming optimized JS and returning the optimized JS which now has your TOC

frank

@futtta

This comment has been minimized.

Show comment
Hide comment
@futtta

futtta Jun 25, 2017

Owner

closing, lack of interest, lack of resources & lack of PR's for this B-)

Owner

futtta commented Jun 25, 2017

closing, lack of interest, lack of resources & lack of PR's for this B-)

@futtta futtta closed this Jun 25, 2017

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment