? Pending

User tests: Successful: Unsuccessful:

avatar dgt41
dgt41
30 Oct 2017

Blast from the past: #3413

Summary of Changes

When not in debug mode then the output gets minified. The minification will not alter:

  • content inside script tags
  • content inside style tags
  • content inside any tag!
    Just removes the spaces, tabs, returns between tags.

Why

Simple answer: less code over the wire!

Here is the proof:

  • com_content/artcles without any minification, html size = 95.57KB

screen shot 2017-10-30 at 16 00 27

  • com_content/artcles with active minification, html size = 84.79KB

screen shot 2017-10-30 at 16 00 59

Around 10KB less data to transmit. WIN!

Testing Instructions

Apply patch, check the html code (in the network tab)
Enable debug, refresh page recheck the page code, size

Documentation Changes Required

None, I think

avatar dgt41 dgt41 - open - 30 Oct 2017
avatar dgt41 dgt41 - change - 30 Oct 2017
Status New Pending
avatar joomla-cms-bot joomla-cms-bot - change - 30 Oct 2017
Category Libraries
avatar mbabker
mbabker - comment - 30 Oct 2017

Honestly, if we're going to do this I'd rather we use proper API endpoints in the HtmlDocument class versus an arbitrary behavior based on debug mode being enabled (maybe you have the behavior default on/off based on debug, but having a proper getter/setter is better than relying on a global constant).

avatar dgt41 dgt41 - change - 30 Oct 2017
Labels Added: ?
avatar joomla-cms-bot joomla-cms-bot - change - 30 Oct 2017
Category Libraries Administration Templates (admin) Libraries Front End Templates (site)
avatar dgt41
dgt41 - comment - 30 Oct 2017

@mbabker something like

	/**
	 * Minification switch
	 *
	 * @var    boolean
	 * @since  __DEPLOY_VERSION__
	 */
	public $minify = false;
avatar mbabker
mbabker - comment - 30 Oct 2017

That works.

avatar Bakual
Bakual - comment - 30 Oct 2017

Few questions:

  • Isn't preg_replace quite a costly command? I always try to not use regex if not absolutely necessary.
  • What happens if there is intentional whitespace between two tags (eg two ) for whatever reason? This may break layouts (altought not much).
  • Aren't there already multiple plugins which do the same, but let you even customise which pages to minimise?

Imho it's not worth minimising stuff during runtime. To much performance impact and risk of failures for almost no gain. But that's a personal view of course.

avatar dgt41
dgt41 - comment - 30 Oct 2017

Isn't preg_replace quite a costly command? I always try to not use regex if not absolutely necessary.

Well nothing is for free in this world :D

What happens if there is intentional whitespace between two tags (eg two ) for whatever reason? This may break layouts (altought not much).

That's invalid HTML and we should not allow it anyways
Obviously wrong answer, for the browser the whitespace, return, tabs, etc have the same weight and result to zero changes in the DOM creation. So if the DOM ignores them how can alter the design?

Imho it's not worth minimising stuff during runtime.

We're not in 2008 anymore and mobile era requires other tricks and best practices, so I'm gonna leave this here:
dnsdcqhvwaalmwe
The full doc from Alex Russell is here: https://infrequently.org/2017/10/can-you-afford-it-real-world-web-performance-budgets/

avatar Bakual
Bakual - comment - 30 Oct 2017

Obviously wrong answer, for the browser the whitespace, return, tabs, etc have the same weight and result to zero changes in the DOM creation. So if the DOM ignores them how can alter the design?

The browser reduces multiple whitespaces to one. So if you remove all whitespace, that would change it.

We're not in 2008 anymore and mobile era requires other tricks and best practices, so I'm gonna leave this here:

We are almost in 2018 were a few bytes don't matter anymore even on mobile.
But once again, if those bytes matter for your application, then by all means install a plugin which does the minimising. Preferably on a cache and not runtime. There are better solutions already available for those who need it.

avatar dgt41
dgt41 - comment - 30 Oct 2017

We are almost in 2018 were a few bytes don't matter anymore even on mobile.

WOW, you should REALLY read that article, you're misinformed, bytes DO COUNT!

Anyways this is an opt-in (after Micheal's comment), so you can yah your template without any minification, it's not forced anymore!

avatar Bakual
Bakual - comment - 30 Oct 2017

WOW, you should REALLY read that article, you're misinformed, bytes DO COUNT!

I've read it. The article is about AMP and interactive applications where it is very important that they are very responsive. At least that's what I understood. As I wrote, if you have such requirements for whatever reason, solutions already exist. For regular websites this is way less a concern.

Anyways this is an opt-in (after Micheal's comment), so you can yah your template without any minification, it's not forced anymore!

It's not opt-in. It's enabled for the core templates without any possibility to turn it off. If it starts breaking layouts (on microlevel, but can still be annoying), developers will hate the guy that implemented this...

avatar C-Lodder
C-Lodder - comment - 30 Oct 2017

@Bakual - intentional whitespace (more than 1) should be done with  

@dgt41 - do we know the performance cost of the preg?

avatar dgt41
dgt41 - comment - 30 Oct 2017

For regular websites this is way less a concern.

Sorry, you are wrong. Over 70% of the web traffic is from mobile and that article IS about getting a mobile SITE correctly, today. This is !important

will hate the guy that implemented this...

Well, I'm used to it

@C-Lodder pretty sure we can measure it.

EDIT: for the articles page with the 10KB reduction (pictures in the description) the time is:
screen shot 2017-10-30 at 19 53 55
PC: MacBook Pro (Retina, 13-inch, Late 2013) 2,4 GHz Intel Core i5, 8GB ram, many open IDEs etc

avatar Fedik
Fedik - comment - 30 Oct 2017

no, please not as default,
it job for plugin or whatever

plus, used regexp looks very "naive", you call it over whole document with possible inline scripts etc

avatar Bakual
Bakual - comment - 30 Oct 2017

intentional whitespace (more than 1) should be done with  

Yes, if more than one whitespace is needed, but you're not removing duplicate whitespace. You're removing all whitespace that is between > and <.
A better regex would detect duplicate whitespace and replace it with a single one. Then at least you wouldn't risk breaking layouts. But likely you would save much less bytes then, making it even less usefull.

Sorry, you are wrong. Over 70% of the web traffic is from mobile and that article IS about getting a mobile SITE correctly, today. This is !important

We're not talking about getting a site correctly. It works perfectly fine as it is already.

avatar dgt41
dgt41 - comment - 30 Oct 2017

if more than one whitespace is needed

Right. Have you ever heard about CSS? Using spaces for layout?

It works perfectly fine as it is already.

Right. Open Chrome, go to console->audits and do an audit for joomla.org. It's working fine ?

Why am I even bother to answer such questions

avatar Bakual
Bakual - comment - 30 Oct 2017

Right. Have you ever heard about CSS? Using spaces for layout?

Honestly? Are we now trying to say a simple whitespace has to be replaced with CSS? Just so you can replace all whitespace?

Right. Open Chrome, go to console->audits and do an audit for joomla.org. It's working fine

Maybe I miss the point but to me it shows a lot, but from what I see the whitespace isn't the issue there. It actually passes the network payload audit.

avatar chrisdavenport
chrisdavenport - comment - 30 Oct 2017

gzip compression is very good at exploiting redundancy in strings, that's how it works, so just turn it on. No need to write any (slow) regex code.

Besides, I think there may be edge cases where this gives undesirable results. For example, if I have a couple of words wrapped in their own spans, then the space between the words will be lost. eg.

<span class="first">Go</span> <span class="second">Joomla!</span>

will become

GoJoomla!

instead of

Go Joomla!

avatar dgt41
dgt41 - comment - 30 Oct 2017

@Bakual you can still have whitespace @C-Lodder showcased it above. And you're missing the point, mobile (all of them) are on a tight budget due to bad network, whatever you can save form crapware like jQuery, bootstrap etc and whatever reductions you do server side on the data you send over the wire do make a huge different. We're not building sites for desktops anymore, we have to shift our best practices.

Anyways if this is not appropriate for Joomla I'll just close it, NP. By the way this has been in production for 3years without any glitch.

@chrisdavenport do it like:

<span class="first">Go</span>&nbsp;<span class="second">Joomla!</span>

and you'll still get your space there!

avatar brianteeman
brianteeman - comment - 30 Oct 2017

If you didn't repeat the same rant at every opportunity people might be more willing to listen to you.

As for using nbsp - try telling a content creator to do that..they shouldn't need to know about code.

avatar chrisdavenport
chrisdavenport - comment - 30 Oct 2017

and you'll still get your space there!

Are you expecting end-users to know they must do that, or are you suggesting a change to your regex (which would actually make your string longer instead of shorter)?

avatar dgt41
dgt41 - comment - 30 Oct 2017

I won't go further with this. Keep it as is, it's fine

avatar dgt41 dgt41 - change - 30 Oct 2017
Status Pending Closed
Closed_Date 0000-00-00 00:00:00 2017-10-30 21:40:56
Closed_By dgt41
avatar dgt41 dgt41 - close - 30 Oct 2017

Add a Comment

Login with GitHub to post a comment