[ 
https://issues.apache.org/jira/browse/TAP5-769?page=com.atlassian.jira.plugin.system.issuetabpanels:all-tabpanel
 ]

Andy Blower updated TAP5-769:
-----------------------------

    Description: 
I think Tapestry's JavaScript combination functionality is flawed. Each page & 
component specifies which JS files it needs, which means that JS can be split 
into functional units (good for development & maintenance) and only the JS 
that's actually needed for that page is added for the client to download. The 
consequence of this is that pages can have lots of JS files to download, all of 
which has to be downloaded before the page is loaded/rendered now that the 
script link tags are enforced to be back in the head section. Our search 
results page has 34 JS files for instance.

Yahoo's YSlow tool recommends that these files are combined and minified, and 
Tapestry includes functionality to do the first (minifying is on the TODO list 
I believe) probably as a response to this recommendation which is good. 
Unfortunately the implementation based on only having the JS files required for 
a page means that the combined JS can easily be unique for most pages of a 
site. This means that the client browser has to download & cache lots of large 
JS multiple times (prototype, scriptaculous, tapestry etc) as part of bigger 
combined files, which I think is probably worse than requesting them 
separately, but only downloading stuff once and using that for all pages.

To solve this issue, Tapestry script combination could combine all of the 
scripts needed for the site, and not just the unique set for each page. That 
way only a single JS file needs to be downloaded and cached by the client 
browser. I'm aware that this may not be that easy given the existing way only 
scripts needed for the page are put on it, so an alternative solution that may 
be easier to implement would be to combine scripts into two files for each 
page. The first file would contain all of the commonly Tapestry provided JS 
such as prototype.js, scriptaculous.js, effects.js, tapestry.js, etc in one 
file that's the same for every page, and have the rest in a second file that is 
unique for the page but that is not likely to include very large JS files, just 
many little ones.

A second flaw that the combination has is that if an external JS file is 
requested, script combination is aborted rather than just excluding the 
external file from the combination.

One other thing that surprised me about Tapestry's script combination is the 
length of the generated filename, for example it's 919 characters long for a 
page on our site.

  was:
Tapestry's JavaScript combination functionality is flawed. Each page & 
component specifies which JS files it needs, which means that JS can be split 
into functional units (good for development & maintenance) and only the JS 
that's actually needed for that page is added for the client to download. The 
consequence of this is that pages can have lots of JS files to download, all of 
which have to be downloaded before the page is loaded/rendered now that the 
script link tags are enforced to be back in the head section. Our results page 
has 34 JS files for instance.

Yahoo's YSlow tool recommends that these files are combined and minified, and 
Tapestry includes functionality to do the first (minifying is on the TODO list 
I believe) as a response to this recommendation which is good. Unfortunately 
the implementation based on only having the JS files required for a page means 
that the combined JS can easily be unique for each page of a site. This means 
that the client browser has to download & cache lots of large JS multiple times 
(prototype, scriptaculous, tapestry etc) which I think is probably worse than 
requesting them separately, but only downloading stuff once and using that for 
all pages.

To solve this issue, Tapestry script combination should combine all of the 
scripts needed for the site, and not just the unique set for each page. That 
way only a single JS file needs to be downloaded and cached by the client 
browser. I'm aware that this may not be that easy given the existing way only 
scripts needed for the page are put on it, so an alternative solution that may 
be easier to implement would be to combine scripts into two files for each 
page. The first file would contain all of the commonly Tapestry provided JS 
such as prototype.js, scriptaculous.js, effects.js, tapestry.js, etc in one 
file that's the same for every page, and have the rest in a second file that is 
unique for the page but that is not likely to include very large JS files, just 
many little ones.

A second flaw that the combination has is that if an external JS file is 
requested, script combination is aborted rather than just excluding the 
external file.

One other thing that surprised me about Tapestry's script combination is the 
length of the generated filename, for example it's 919 characters long for a 
page on our site: 
H4sIAAAAAAAAALVW7ZLSMBTFGX0Rx$002fFrZgk7gvjDH0plBWdRho6ujjpOmt7ChTTpJmlZfBYfwVfzHUwKRRiFXUrlV0hPzs39OKf9$002bat253utdrtmf3drjwnVGowmmilMDGUpl6kmrfppvVFvkURJI80igfpU1$002br7sVu7Dv9wPx6iCJjJkfcKpKEJaKMWa1Cx4VD3C1TAKZsFqMI1bL3jcCfXsp3EoDUdQx78cwFn3C4SaiaEsfDps0bUeNJstprtoE2YjF0tLlN7nNAksWCpgGNApjSjy$002fzIUCZpcoEilPNzFLNqyfuCo4APlGNIDUrhyL2C3B76J20iBQj7PF4o0EAVmxAfx6Iv3mWgOM2r2i1BMlQQgQLBQLtMHQ2tKlGO44nJEOZkqv$002f8cSFGR4XYyGQj$002bxelS3gmVewYnu9lyNYNI6kGJWhc9FAqd$002fpNifieAmpgqGSEHDZy$002bXZYfXIT2N2HpfQxcW0o1i7K$002b6q60BeR7KRBwHNzebTfLJgURkmea6q9U99FlBivUNiapka6gBwMHC$002fGFanHpab20i8tubdB3rlpJwsNObfw02BqTfActSk9jTQDP186hi9VdWcEOuVGnyE3VulhJ5$002bw1wfm2MMwBNFDM6BqBsqfo1le8zgpb0ypJ$002bUMlz7eu$002bnlMtQp5SFoq2MyoCg8O1z2yciZzUG$002busXUvbRrT$002fI0Fgcpe4vEnuc00WgHzLeDsTL6B9e8ea2hgCrlwtYEbv3YNQOvrM2MqBjD1jC4OJ$002f$002by5jlbfxaFfVgMVppxJuA$002fTqQV47$002bYwmJ$002fc10gWby1jpihGz9Nq7MGLsi9O33yZL2NyNGzuevCQAA.js


> Combination of JavaScript is flawed
> -----------------------------------
>
>                 Key: TAP5-769
>                 URL: https://issues.apache.org/jira/browse/TAP5-769
>             Project: Tapestry 5
>          Issue Type: Bug
>          Components: tapestry-core
>    Affects Versions: 5.1.0.5
>            Reporter: Andy Blower
>
> I think Tapestry's JavaScript combination functionality is flawed. Each page 
> & component specifies which JS files it needs, which means that JS can be 
> split into functional units (good for development & maintenance) and only the 
> JS that's actually needed for that page is added for the client to download. 
> The consequence of this is that pages can have lots of JS files to download, 
> all of which has to be downloaded before the page is loaded/rendered now that 
> the script link tags are enforced to be back in the head section. Our search 
> results page has 34 JS files for instance.
> Yahoo's YSlow tool recommends that these files are combined and minified, and 
> Tapestry includes functionality to do the first (minifying is on the TODO 
> list I believe) probably as a response to this recommendation which is good. 
> Unfortunately the implementation based on only having the JS files required 
> for a page means that the combined JS can easily be unique for most pages of 
> a site. This means that the client browser has to download & cache lots of 
> large JS multiple times (prototype, scriptaculous, tapestry etc) as part of 
> bigger combined files, which I think is probably worse than requesting them 
> separately, but only downloading stuff once and using that for all pages.
> To solve this issue, Tapestry script combination could combine all of the 
> scripts needed for the site, and not just the unique set for each page. That 
> way only a single JS file needs to be downloaded and cached by the client 
> browser. I'm aware that this may not be that easy given the existing way only 
> scripts needed for the page are put on it, so an alternative solution that 
> may be easier to implement would be to combine scripts into two files for 
> each page. The first file would contain all of the commonly Tapestry provided 
> JS such as prototype.js, scriptaculous.js, effects.js, tapestry.js, etc in 
> one file that's the same for every page, and have the rest in a second file 
> that is unique for the page but that is not likely to include very large JS 
> files, just many little ones.
> A second flaw that the combination has is that if an external JS file is 
> requested, script combination is aborted rather than just excluding the 
> external file from the combination.
> One other thing that surprised me about Tapestry's script combination is the 
> length of the generated filename, for example it's 919 characters long for a 
> page on our site.

-- 
This message is automatically generated by JIRA.
-
You can reply to this email to add a comment to the issue online.

Reply via email to