[RFC] Make the use of defer mandatory

Note: We are moving the topics of this forum and it will be deleted at some point

Publish your own request for comments/change or patches for the next version of phpBB. Discuss the contributions and proposals of others. Upcoming releases are 3.2/Rhea and 3.3.
Post Reply
User avatar
brunoais
Registered User
Posts: 964
Joined: Fri Dec 18, 2009 3:55 pm

[RFC] Make the use of defer mandatory

Post by brunoais »

This is (somewhat) an opposition to:
viewtopic.php?p=228911#p228911

Introduction
The defer and async is becoming standard in the browsers these days and are compatible with all current implementations of javascript where document.write() and document.writeln() (or equivalent, if exists) is not used.

Idea
(assuming the previous paragraph) If we use defer we can make the code exactly as it didn't have both and it will work perfectly, so it does not matter if the browser supports them or not. If the browser does support them, it's only a gain to the user. If it does not support, tough luck user, you'll have to endure it. not supporting them will not reduce the functionality, just the loading time will be greater.

Changes needed to the styles
PhpBB does not make extensive use of these useful-for-non-web-but-poisonous-for-web methods but unfortunatly it does. Anyway, the adaptation is easy.
The poisonous code I found lies in both prosilver and subsilver2 under the file editor.js in the function colorPalette(). I studied the changes needed and they are minor.

Pros
If the browser supports it:
  • Faster page loading caused by parallel loading of the js files.
  • If the browser does not support these attributes, it work the same way as it is now.
  • Besides removing the document.write() the rest of the code works "as is" (according to my research)
Cons
  • Some code has to be executed differently for this to go well. Eg. All write() and writeln() must be removed.
  • A new rule has to appear in the coding guidelines. New rule, code changes are needed.
Edit: After some testing I came to the conclusion that async isn't really the best idea. Anyway, defer is really the way to go!
Last edited by brunoais on Thu Feb 02, 2012 12:43 pm, edited 1 time in total.

User avatar
callumacrae
Former Team Member
Posts: 1046
Joined: Tue Apr 27, 2010 9:37 am
Location: England
Contact:

Re: [RFC]Make the use of defer and async mandatory

Post by callumacrae »

As the code is at the bottom of the page, all of your advantages are invalid.
Made by developers, for developers!
My blog

User avatar
brunoais
Registered User
Posts: 964
Joined: Fri Dec 18, 2009 3:55 pm

Re: [RFC]Make the use of defer and async mandatory

Post by brunoais »

callumacrae wrote:As the code is at the bottom of the page, all of your advantages are invalid.
If that's true, why is that that in this thread's page (prosilver) there are, at least, 2 script tags with the @src attribute?

User avatar
callumacrae
Former Team Member
Posts: 1046
Joined: Tue Apr 27, 2010 9:37 am
Location: England
Contact:

Re: [RFC]Make the use of defer and async mandatory

Post by callumacrae »

That's not what I meant, I meant the code includes.
Made by developers, for developers!
My blog

User avatar
brunoais
Registered User
Posts: 964
Joined: Fri Dec 18, 2009 3:55 pm

Re: [RFC]Make the use of defer and async mandatory

Post by brunoais »

That's no problem. I'm mentioning the output HTML and the browser execution. Code inclusion is not the problem here.

User avatar
Arty
Former Team Member
Posts: 985
Joined: Wed Mar 06, 2002 2:36 pm
Location: Mars
Contact:

Re: [RFC]Make the use of defer and async mandatory

Post by Arty »

After short discussion on IRC, I'm convinced that this is a good idea with addition of moving jQuery in header with defer.

There is one big downside to loading jquery in footer: it cannot be used in scripts loaded in templates. With deferred loading of jquery in header and deferred loading of page specific scripts in those pages, those scripts can use jquery.

Example: loading editor.js on editor pages.

Current situation:
- editor.js has to be loaded in footer after jquery OR
- editor.js should not use jQuery (making jquery rather pointless)

With defer:
- editor.js can be loaded from editor template with defer and it can use jquery

It will not affect page loading speed, but it will make it easier to include page specific scripts.

User avatar
callumacrae
Former Team Member
Posts: 1046
Joined: Tue Apr 27, 2010 9:37 am
Location: England
Contact:

Re: [RFC]Make the use of defer mandatory

Post by callumacrae »

This means that we're going to have to rewrite any code that changes anything DOM-wise on page load to use document.ready. Why not use defer, but keep it in the footer? (like html5bp does)
Made by developers, for developers!
My blog

User avatar
Arty
Former Team Member
Posts: 985
Joined: Wed Mar 06, 2002 2:36 pm
Location: Mars
Contact:

Re: [RFC]Make the use of defer mandatory

Post by Arty »

callumacrae wrote:This means that we're going to have to rewrite any code that changes anything DOM-wise on page load to use document.ready.
Nothing changes for that code. onload event isn't going anywhere.
It would make sense to rewrite it, but its not required.
callumacrae wrote:Why not use defer, but keep it in the footer? (like html5bp does)
Using defer in footer makes whole idea of using defer void.

User avatar
hanakin
Front-End Dev Team Lead
Front-End Dev Team Lead
Posts: 913
Joined: Sat Dec 25, 2010 9:02 pm
Contact:

Re: [RFC]Make the use of defer mandatory

Post by hanakin »

true i would argue that the size of editor uncompressed is only 12k and the same for forum_fn even. we should first look at combining and compressing and possibly gziping all external js and css anyway to reduce the amount of server requests and overall bandwidth then this one file could be include in the footer thus eliminating the reasoning for it in the jquery in the header. We should never be including any js before the jquery statement in the first place as their should be no inline calls or more than one or two script tags nessecary
Donations welcome via Paypal Image

igorw
Registered User
Posts: 500
Joined: Thu Jan 04, 2007 11:47 pm

Re: [RFC]Make the use of defer mandatory

Post by igorw »

Totally missed this topic. After looking into it, this seems like a really good idea. And since it's trivial to implement, we could probably even add it to 3.1. It would make a few things quite a lot easier.

Browser support is pretty good, only opera is not supported. And in cases where it's not supported, the only downside is that it will be a little bit slower. It will not break anything. http://caniuse.com/#feat=script-defer

I'm +1.

Post Reply