[Define New Theme] 9. The css/js that is served and cached should be minified/compressed/gzipped.

General discussion of development ideas and the approaches taken in the 3.x branch of phpBB. The current feature release of phpBB 3 is 3.3/Proteus.
Forum rules
Please do not post support questions regarding installing, updating, or upgrading phpBB 3.3.x. If you need support for phpBB 3.3.x please visit the 3.3.x Support Forum on phpbb.com.

If you have questions regarding writing extensions please post in Extension Writers Discussion to receive proper guidance from our staff and community.
User avatar
brunoais
Registered User
Posts: 964
Joined: Fri Dec 18, 2009 3:55 pm

Re: [Define New Theme] 9. The css/js that is served and cached should be minified/compressed/gzipped.

Post by brunoais »

hanakin wrote:It's run through NodeJS yes.
Then it's a no-go for the default package.
hanakin wrote:As per how it's better it provides better optimization options for the minification
Such as?
hanakin wrote:and the less compiling that the ones you elude to which are extremely useful.
What am I evading that I shouldn't? If I'm evading steps, I have no clue what they are.
hanakin wrote:I'm fine with yours I guess if I can opt out of it for my own way
Sure! The idea includes placing events in appropriate places that allows just that. I just omitted that (as in: not relevant yet).

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

Re: [Define New Theme] 9. The css/js that is served and cached should be minified/compressed/gzipped.

Post by hanakin »

brunoais wrote:
hanakin wrote:As per how it's better it provides better optimization options for the minification
hanakin wrote:and the less compiling that the ones you elude to which are extremely useful.
Such as?
it depends on which package you use. Gulp relies on modules and their are several modules to accomplish this each which their own spin and flavor. Most of these are useful for devs though. Big ones are

ability to setup your own output file structure for one. Its not as easy as 1 to 1 file conversion as not all code maybe required for each page so it should be split into three files global, core, theme. Where theme is customized per certain pages. IE admin panel would use same global and core files but would need it own theme file same goes with the ucp/mcp.

How to handle individual types of conversions ie running bless, how to handle certain types of comments. providing built in code smell and linting.
brunoais wrote: What am I evading that I shouldn't? If I'm evading steps, I have no clue what they are.
not evading, eluding means that you pointed out earlier. sorry for large words I was at work and its a different environment so I get caught up in how I have to write their.
Donations welcome via Paypal Image

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

Re: [Define New Theme] 9. The css/js that is served and cached should be minified/compressed/gzipped.

Post by callumacrae »

brunoais wrote:When there's errors in the CSS, the browser only reports them in the "compiled" CSS. How do you expect the style author to relate the different lines?
If it is constantly minified, how can the line number be useful when debugging and when checking for inconsistencies?
If someone like me finds an error in his version, there's no "unminified" version available. Are you forcing me to download another "full version" just to test and reproduce the error? I'd rather just flip the value of a constant and try again to gather as much material as possible. Having to download a "sister" version, clone the DB, install it, etc... Is a HUGE pain. Don't forget that I'd have to repeat the steps to get the error so I need first to reproduce the error multiple times until I pinpoint the issue to report it. If I don't do it in a clone of the original one, I can easily end up killing my live version.
LESS has had support for source maps since November 2013.
Made by developers, for developers!
My blog

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

Re: [Define New Theme] 9. The css/js that is served and cached should be minified/compressed/gzipped.

Post by callumacrae »

brunoais wrote:
hanakin wrote:It's run through NodeJS yes.
Then it's a no-go for the default package.
Build tools are the future of front-end development.

And the past. But I guess you're not quite there yet.
Made by developers, for developers!
My blog

User avatar
MattF
Extension Customisations
Extension Customisations
Posts: 675
Joined: Mon Mar 08, 2010 9:18 am

Re: [Define New Theme] 9. The css/js that is served and cached should be minified/compressed/gzipped.

Post by MattF »

Using gulp/grunt is just another set of build tools that will automate build tasks for the development team, and these ones in particular will, as this topic requests, allow us to distribute phpBB with minified/concatenated CSS/JS.

Without these tools, every time somebody wants to change the CSS, they will have to find their own means of minification, which will lead to total disarray and a lack of standardization. These tools will allow a consistent compilation/concatenation/minification workflow for the entire team and all outside contributors as well.

There's good reason these tools have become so popular, especially among team-based development workflows.
Has an irascible disposition.

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

Re: [Define New Theme] 9. The css/js that is served and cached should be minified/compressed/gzipped.

Post by brunoais »

callumacrae wrote:
brunoais wrote:When there's errors in the CSS, the browser only reports them in the "compiled" CSS. How do you expect the style author to relate the different lines?
If it is constantly minified, how can the line number be useful when debugging and when checking for inconsistencies?
If someone like me finds an error in his version, there's no "unminified" version available. Are you forcing me to download another "full version" just to test and reproduce the error? I'd rather just flip the value of a constant and try again to gather as much material as possible. Having to download a "sister" version, clone the DB, install it, etc... Is a HUGE pain. Don't forget that I'd have to repeat the steps to get the error so I need first to reproduce the error multiple times until I pinpoint the issue to report it. If I don't do it in a clone of the original one, I can easily end up killing my live version.
LESS has had support for source maps since November 2013.
Ah! So you mean that both minified and unminified version are chipped with phpBB?
I made some research given that,
I wasn't updated on the source map for CSS, only the sourceMap for JS (I guess it's for both, not just js after all).
@VSE
So you mean that everybody (not just web dev) will have to setup such that, every time a change happens, it must activate (manually or automatically) gulp for the changes he does?
Does that mean that a new requirement for styles will arrive such that style authors become obliged to use gulp no matter what they prefer to use?
The process for this feels pretty straight forward. Why not let phpBB do it itself? I already know about gulp's existance and I think I have a good idea of what it does. Are you sure it is a good idea for a project that like phpBB? Looks good for a private project in a company or when the project is closed source but an open source where many many people change it, are you sure? It is already a PITA(!) having to deal with composer and its issues but, at least, it is a 1 time thing. Gulp requires setup to run manually or automatically (I didn't find a fully automated way to run it automatically on file changes (nearest one: https://www.npmjs.org/package/gulp-watch )).
You know you are asking the user to get more software. NodeJS seems to be the only way of running gulp at the moment. It would make all the sense if it was jsBB (phpBB but written in javascript for NodeJS (or equivalent)) but it's not.

So I say it again, gulp seems nice for projects with a stable group of people or only web dev kind of people working on it. I don't think that the casual user who just wants to tweak a color of the background or make some minor adjustments to the style will ever want to meddle with that. By forcing to use gulp to get the desired results, we no longer can say that making changes to the styles is direct and easy. It may still be easy but it is not even near of direct. Given that I still wonder if it still makes sense to tell others to do the tweaks (to the styles) themselves if they want to.

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

Re: [Define New Theme] 9. The css/js that is served and cached should be minified/compressed/gzipped.

Post by hanakin »

@brunoais you are assuming that everyone is a novice or most have no desire to learn how to accomplish things. This is not the case for most and for those that are not willing or wanting to learn better easier ways of working with the files, a none minified version will be available for them to swap in and work with if they so desire. This can be well documented and stated in the wiki for which support can simply point too.

This as VSE pointed out is meant as a simplification for the development team, in order to maintain and provide better, well documented, structured, and modular code to work with.
Donations welcome via Paypal Image

User avatar
MattF
Extension Customisations
Extension Customisations
Posts: 675
Joined: Mon Mar 08, 2010 9:18 am

Re: [Define New Theme] 9. The css/js that is served and cached should be minified/compressed/gzipped.

Post by MattF »

What hanakin said!
brunoais wrote:@VSE
So you mean that everybody (not just web dev) will have to setup such that, every time a change happens, it must activate (manually or automatically) gulp for the changes he does?
Does that mean that a new requirement for styles will arrive such that style authors become obliged to use gulp no matter what they prefer to use?
Absolutely not. Style authors can work with whatever they want, unminified CSS or LESS/SASS source code files. They can compile and minify if they want, or not. A 3rd party style is a totally self contained beast that can be developed however the author wants to do it. phpBB would ship with unminified and source LESS/SASS files that they could use for their own style.
brunoais wrote:So I say it again, gulp seems nice for projects with a stable group of people or only web dev kind of people working on it. I don't think that the casual user who just wants to tweak a color of the background or make some minor adjustments to the style will ever want to meddle with that. By forcing to use gulp to get the desired results, we no longer can say that making changes to the styles is direct and easy. It may still be easy but it is not even near of direct. Given that I still wonder if it still makes sense to tell others to do the tweaks (to the styles) themselves if they want to.
Gulp/Grunt are exactly the thing for team-based projects, especially one such as phpBB where everybody is spread out around the globe and people who contribute do so at their own will, and based on their own abilities. These task runners will serve to standardize the CSS/JS code that is delivered by phpBB and minimize disarray for the developers trying to work on it, if the goal is to ship with minified CSS (and to simplify CSS development by using LESS/SASS).

Using Gulp/Grunt are dead-simple. It is installed in a matter of seconds. The configuration files would already be in phpBB's repo, so it is just a matter of either running the single "gulp" or "grunt" command if you made changes to CSS/JS, or more likely phpBB will have a git-hook to do that automatically on commits, or perhaps on merge/rebases that the developer team does when they merge pull requests, or it would simply be done during the build process of each release/distribution package.
Has an irascible disposition.

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

Re: [Define New Theme] 9. The css/js that is served and cached should be minified/compressed/gzipped.

Post by callumacrae »

It's unbelievably easy to install Node and gulp. Every modern front-end developer worth his or her salt already has them. I really don't see what the issue is.

Anyway, if a style author wants to use CSS, they can just use the generated CSS.
Made by developers, for developers!
My blog

User avatar
Louis7777
Registered User
Posts: 394
Joined: Fri Apr 04, 2014 12:32 am

Re: [Define New Theme] 9. The css/js that is served and cached should be minified/compressed/gzipped.

Post by Louis7777 »

brunoais wrote:IMO we should do most of those! but server-side and only on compile time.
I was thinking the other day... isn't there any server-side way to dynamically combine all the required .css files into one file and then serve it?

Post Reply