Folder structure for scripts and stylesheets vs plugins
I am curious as to the best practices/most efficient way to structure my data.
options
All scripts go in scripts folder, all stylesheets go in css folder.
concerns with this method is that plugins that are dependent on a stylesheet would not be in the same directory and could be overlooked when adding the script to a pageDynamically add styles to plugin script via jQuery negating the need for the external stylesheet.
concerts with this method is the overhead loading styles via jQuery vs. stylesheetSeparate scripts, stylesheets, and plugins into separate folders and have the plugins script dynamically load the stylesheet.
concerns with this method is that it's possibly equal to, or greater than the overhead of the previous method
I'm unsure of the overhead on options 2 & 3, they would be the cleanest/preferred methods however.
I plan on documenting the process on using the custom plugins, however I wa开发者_如何学Cnt to prevent over-site and future confusion but need to maintain low overhead.
options
1 - All scripts go in scripts folder, all stylesheets go in css folder....
Correct. Normalize all paths to suit this structure.
2 - Dynamically add styles to plugin script via jQuery negating the need for the external stylesheet. concerts with this method is the overhead loading styles via jQuery vs. stylesheet
Browser have a cache for a reason. This breaks the ability to cache.
3 - Separate scripts, stylesheets, and plugins into separate folders and have the plugins script dynamically load the stylesheet. concerns with this method is that it's possibly equal to, or greater than the overhead of the previous method
Don't load stylesheets dynamically. See #2.
Personally I use this type of folder structure, because it clearly defines the code I must manage versus the code I use but do not manage.
Content
scripts
//scripts you created
css
//css you create
images
// images you created
frameworks
jQuery
jQueryUI
Other Plugins
I recently wrote a post detailing my folder setup, which is based on a siloed structure of 4 top-level folders:
/assets
/content
/resources
/vendor
The reason for this is separation of concerns, based on 3 main criteria:
- what is the content type?
- who is responsible for the content?
- how often the content will be updated?
The core tenet is separating 3rd-party code from project code through /vendor and /assets.
Any code that should be layered between (e.g. themes, enhancements, monkey-patches) should go in /assets/vendor.
Therefore your customisation hierarchy is:
- /vendor
- /assets/vendor
- /assets/[resource type]
It won't solve your questions about the way to load assets, but it will provide structure on how you manage your assets.
More info and examples here: http://www.davestewart.co.uk/blog/project-structuring/
精彩评论