We are about to start on several projects that will involve extending an existing application with javascript. The types of extension of the existing application could vary from branding (moving/hiding/creating elements on the page) to adding new functionality (dynamically added buttons that communicate with the application's API and other external APIs).
The admin settings of the application we are extending contains a field that allows you to provide a link to an external javascript that would be loaded on every page. We need something that will take all the javascript files we create and turn it into a single script that can be placed in that field.
My initial feeling is to use jQuery and query for particular elements on the page and perform modifications in that way. However I could foresee this becoming not very maintainable for several reasons:
- Little code reuse if following standard jQuery paradigm (query then do everything in callback)
- Prone to breakage due to being dependent on layout structure
- Unstructured and procedural
What I'm looking for is patterns or insight from other people who have solved this problem before. It appears that this would be fairly similar to development of a browser extension and probably won't be a good choice for a dedicated front-end framework (AngularJS, etc). A couple things that a good solution would handle nicely would be:
- RESTful API calls that maximized code reuse
- Fault tolerant hooking into page elements
- Play nicely with living on top of existing dynamic elements (Use MutationObserver?)
Aucun commentaire:
Enregistrer un commentaire