What is better? Adding Javascript once at top of page type file or adding it at top of whatever block uses it?
Permalink 1 user found helpful
Or does it even make any difference?
I am thinking that cache wise...there may be a difference between adding it at the top of a page type PHP file vs adding it to the top of whatever block uses it.
The javascript in question is a JQuery plugin that allows me to use what is called placeholder text inside HTML form fields. Placeholder text being text that gives a hint to the user about a given field...inside the field itself (I do not believe this can be used with the C5 form helper so I unhelpified :) the form helper code and went back to plain HTML inside my blocks instead).
Is it worth adding some sort of Javascript constant that gets set to true somewhere to keep C5 from reloading a plugin that has already (presumably) been loaded?
Any insight and tips on this would be appreciated and will help me write better blocks for the benefit of all.
Thanks.
Carlos
I am thinking that cache wise...there may be a difference between adding it at the top of a page type PHP file vs adding it to the top of whatever block uses it.
The javascript in question is a JQuery plugin that allows me to use what is called placeholder text inside HTML form fields. Placeholder text being text that gives a hint to the user about a given field...inside the field itself (I do not believe this can be used with the C5 form helper so I unhelpified :) the form helper code and went back to plain HTML inside my blocks instead).
Is it worth adding some sort of Javascript constant that gets set to true somewhere to keep C5 from reloading a plugin that has already (presumably) been loaded?
Any insight and tips on this would be appreciated and will help me write better blocks for the benefit of all.
Thanks.
Carlos
Outstanding input JohntheFish! Thanks!
A couple of follow up questions if I might (feel free to ignore them and let others answer more if they are inclined to do so)...
Is there a reason to add the javascript through the HTML helper in the controller as opposed to just putting in a
directly at the top of the edit.php file (for example)?
By implicit do you mean that C5 automatically loads whatever JS file is inside the js directory (within the block directory) for the block whenever the view.php, edit.php, or add.php files are activated on a page? Without the need to put anything in the controller?
Does it do that automatic loading no matter what file in your block is activated? What if you just need it in the view.php file only for example? Isn't that kind of a waste? To load it all over for the block?
If it does load all js inside the js directory automatically, why the .js file inside the overall block directory that often shows up inside blocks here when I download a block and start looking at the way it is made?
Why not stick all .js files inside the js directory?
Also...you mention each copy of the block only applying the js to it's own DOM elements. Is that js still in memory after the block runs? Would it not be accessible after the block runs to other blocks anywhere just like JQuery itself is accessible throughout as a result of it too being loaded?
One more question...do you (or anyone) know if the possibility of various blocks loading the same JQuery plugins all over again contribute substantially to slowing C5 down?
Any further input from you (or anyone) on any or all of the above would be most appreciated.
Carlos
A couple of follow up questions if I might (feel free to ignore them and let others answer more if they are inclined to do so)...
Is there a reason to add the javascript through the HTML helper in the controller as opposed to just putting in a
<script>plugin_file_name.js</script>
directly at the top of the edit.php file (for example)?
By implicit do you mean that C5 automatically loads whatever JS file is inside the js directory (within the block directory) for the block whenever the view.php, edit.php, or add.php files are activated on a page? Without the need to put anything in the controller?
Does it do that automatic loading no matter what file in your block is activated? What if you just need it in the view.php file only for example? Isn't that kind of a waste? To load it all over for the block?
If it does load all js inside the js directory automatically, why the .js file inside the overall block directory that often shows up inside blocks here when I download a block and start looking at the way it is made?
Why not stick all .js files inside the js directory?
Also...you mention each copy of the block only applying the js to it's own DOM elements. Is that js still in memory after the block runs? Would it not be accessible after the block runs to other blocks anywhere just like JQuery itself is accessible throughout as a result of it too being loaded?
One more question...do you (or anyone) know if the possibility of various blocks loading the same JQuery plugins all over again contribute substantially to slowing C5 down?
Any further input from you (or anyone) on any or all of the above would be most appreciated.
Carlos
All js is visible throughout a rendered page. Web browsers don't know about C5 blocks. So you have the same issues no matter how you build a web site.
By using the C5 mechanisms, you let the core know what is going on.
A significant hassle with C5 and JS is where the same library gets included by 2 different blocks from 2 different places under 2 different names .... and causes a JS script error in the browser.
This issue is worsened by some block developers not using the C5 mechanisms to include JS.
There are moves afoot for the core libraries (or other mechanisms) to implement measures to help prevent such script collisions. By using any method other than that which is safe, your block could contribute to the problem rather than helping to solve it.
If you use the C5 mechanisms, no matter how many times your block is used on a page, your JS file will only be loaded once in the header.
If you just put in an html script load in your view, you will get multiple downloads of the JS file and slow things down.
By using the C5 mechanisms, you let the core know what is going on.
A significant hassle with C5 and JS is where the same library gets included by 2 different blocks from 2 different places under 2 different names .... and causes a JS script error in the browser.
This issue is worsened by some block developers not using the C5 mechanisms to include JS.
There are moves afoot for the core libraries (or other mechanisms) to implement measures to help prevent such script collisions. By using any method other than that which is safe, your block could contribute to the problem rather than helping to solve it.
If you use the C5 mechanisms, no matter how many times your block is used on a page, your JS file will only be loaded once in the header.
If you just put in an html script load in your view, you will get multiple downloads of the JS file and slow things down.
A wonderful reason for doing things the C5 way respecting Javascript!
I will do it that way for sure given your added input JohntheFish.
Thanks again.
Carlos
I will do it that way for sure given your added input JohntheFish.
Thanks again.
Carlos
By the way...maybe my perspective is less than desirable but I don't like using the html helper at all.
I feel it gets in my way in that it obscures the plain HTML such that I have to go digging around inside the html helper code to figure out what in the world it's doing as opposed to being able to read my own plain HTML code and get all kinds of help and insight from all over the internet about how to better write HTML.
If anyone uses the html helper you can say goodbye to all things HTML over the internet. You are then stuck having to do things the html helper way and are constrained within the boundaries of it's present capabilities.
I routinely remove all html helper stuff (when I can) from my block code and just drop in nice, clean, easy to understand HTML.
Carlos
I feel it gets in my way in that it obscures the plain HTML such that I have to go digging around inside the html helper code to figure out what in the world it's doing as opposed to being able to read my own plain HTML code and get all kinds of help and insight from all over the internet about how to better write HTML.
If anyone uses the html helper you can say goodbye to all things HTML over the internet. You are then stuck having to do things the html helper way and are constrained within the boundaries of it's present capabilities.
I routinely remove all html helper stuff (when I can) from my block code and just drop in nice, clean, easy to understand HTML.
Carlos
Is there some kind of documentation available online that goes into the various ways of working with C5 as a programmer/web developer?
I mean it's great gleaming what insight one's are willing to share with me here but it's such a hit or miss approach to learning how to do this.
I don't mean documentation about what is a block, what files are in a block, what is a single page, etc..
I mean documentation showing the various pluses and minuses of using Javascript in the view.php file vs inside the controller. How the controller interacts with the other files. How to set up a relational database structure for one's database use in a block. How to add JQuery plugin code and where?
That type of stuff.
Best practices stuff. On how to best do this or that among the various ways that it can be done. Insightful stuff. Stuff that makes for a great C5 programmer/web developer.
Anybody?
Carlos
I mean it's great gleaming what insight one's are willing to share with me here but it's such a hit or miss approach to learning how to do this.
I don't mean documentation about what is a block, what files are in a block, what is a single page, etc..
I mean documentation showing the various pluses and minuses of using Javascript in the view.php file vs inside the controller. How the controller interacts with the other files. How to set up a relational database structure for one's database use in a block. How to add JQuery plugin code and where?
That type of stuff.
Best practices stuff. On how to best do this or that among the various ways that it can be done. Insightful stuff. Stuff that makes for a great C5 programmer/web developer.
Anybody?
Carlos
See the Developer section of the documentation and buy Remo's book.
As to where to put the javascript, my Ajax Lessons add-on shows a cross reference table of where javascript works from which source. Its not complete, but covers the most common combinations. Install it on a development system, add a block and have a play in add/edit/view of the block.
As to where to put the javascript, my Ajax Lessons add-on shows a cross reference table of where javascript works from which source. Its not complete, but covers the most common combinations. Install it on a development system, add a block and have a play in add/edit/view of the block.
I'll look at your block and take another look at the Developer Documentation. Don't know anything about Remo's book but I'll Google it.
Thanks John!
Carlos
Thanks John!
Carlos
The book is at the bottom of this pagehttp://www.concrete5.org/developers/...
This tells C5 to add it to the page header when the block is shown on a page.
To do it implicitly, just create a folder called /js/ beneath the block's folder and put the plugin script file in there. C5 will then load it in the page header, same as above.
In both cases C5 will take care of any duplications of the block etc.
Then have a short bit of script to run the plugin directly in the block's view.
That way, each copy of the block only applies the plugin to its own dom elements.
What C5 does not do is to check for other packages with blocks that add the same jquery plugin. Spotting and tweaking an installation to cater for this is currently something that has to be done manually.