I wrote a plugin and I cache the elements that the plugin applies to in $.data("myPlugIn",[]). Is this a good way to do it ?
Also is it ok to do this $.data("myPlugIn").globalVar or absolutely bad ?
If you want to cache jQuery objects for persistent states, then it's ok to store them in data. I can hardly see a use case where you would want to cache the jQuery objects for persistent states, but your case might be different.
However, if you are caching jQuery objects for execution state in data, then you are doing it wrong.
Either way, I believe the speed of read and write to data is much more slower, so I think it's better for you to build the jQuery objects again, rather than read them from data.
Related
I am working on custom SAPUI5 app using ODataModel and for which I have to do the formatting for some of the fields which I will be displaying in List control.
I need to know which approach is good mentioned below is good w.r.t. performance of app.
1) Is it a good idea to use Formatter.js file and write each method for each field for formatting?
Example -
There are 2 fields which should be formatted before showing in UI and hence 2 formatter function.
2) Before binding Model to List - Do the formatting using Loop at each row.
Example -
Loop at OData.
--do formatting here for both the fields
move data to model.
Endloop.
Bind new model to UI
Is there any other way by which we can improve performance - apart from code minification or using grunt.
Appreciate your help.
Thanks,
Rahul
Replacing Formatters with other solutions is definitely NOT the point to start when optimizing performance not to mention that you will loose a lot of the convenience the ODataModel comes with when manually manipulating the data in it.
Formatter Performance
Anyways using a formatter is of course less performant then pre-formatting your data once after they were loaded. A formatter will be executed on every rerendering of your control. So you might not want to do heavy calculations or excessive looping in a formatter that is executed frequently. But given a normal usage using formatters is absolutely nothing you should worry about or that does noticeably affect end-user experience. Keep enjoying the convenience of formatters (and take a look at the cool Expression Binding).
General Performance Considerations
To improve performance it is first of all very important to identify the real bottle neck. In many cases this is simply the backend, there is usually much more to win with much less effort. Always keep that in mind. UI Code optimization is ridiculous as long as the main backend call runs for say 3s.
Things to improve your UI performance might be:
serve SAPUI5 from a CDN
use a Component-preload, can be generated with grunt-openui5 or gulp-ui5-preload (I think it does not minify XML yet so you could do that additionaly before creating Component-preload)
try to reduce the number of SAPUI5 libraries you are using
be aware of which SAPUI5 libraries you are NOT using and very consequently remove those (don't forget the dependencies section in Component metadata resp. manifest.json)
be aware that sap.ui.layout is a separate independent library (not registering it as such will result in a lot of extra requests)
if you use an ODataModel make sure you set useBatch to true (default in v2.ODataModel)
intelligently design your OData service (if you can influence it)
intelligently use $expands: sometimes it can make sense to preload $expand data on a parent binding that does not actually use it e.g. if you most probably need the data later on
think about bundling your app as native app and benefit from improved caching (Kapsel)
Check Performance: Speed Up Your App and Performance Issues
squeeze out some more bytes and save some requests by minifying/combining custom css or other resources if you have some
If you are generally interested in Web Performance I can recommend Steve Souders books.
I'm totally open for more ideas on SAPUI5 performance improvements! Anyone?
BR
Chris
the best practice is to do it this way. The formatter allows you to receive an input and return output. The formatter function will be called in runtime and will be called for each of the rows which are displayed in your list. The reason that it will be called for each of the rows is because that you cannot grantee that the input will be the same for all of the rows in the list.
The concept of binding is to loop on your data model and update the UI accordingly. It is much better to use binding because a lot of reasons like: maintainability, performance, separate the data layer from the presentation layer, core optimizations and more.
I'm generating a form from JSON data that I load via $http.get(), hence use bunch of custom/3rd party directives (ui-select, Bootstrap UI, ...) to get the desired end result. Just to make things more interesting, forms are nested, and with ng-repeat, things still feel pretty sloppy, especially on mobile. Form is quite lengthy and I've split it in several sections, so putting ng-if and displaying one section at a time, as well as using bindonce does improve performance a bit, but not to the extent that I find suitable from UX POV.
The catch 22 is that underlying JSON data is unlikely to change, so ideally I'd like to go with the sloppy version in development, but in production I'd like to build/compile the form, and make it load faster.
I know that 3rd party libraries (namely ui-select) introduce bottleneck, but apart from using $templateCache with $compile in app.run() section, or rendering the form with templating engine such as ejs, what other tweaks should I take into consideration in order to improve performance?
U can also go for caching of data using IndexedDb or Local Storage to cache the JSON Data which can result to load form more faster.
I'm loading data using dojo.io.script.get. Size of each request can be big and I need to issue lots of them.
Question is, after data loaded and later dismissed is it cached by browser?
In other words, when I load some data that have content "myFunc('blah blah blah')". It will execute myFunc function. What happens to the browser memory after execution? If I say load it 100 times and size of each string within myFunc is say 1GB, will browser run out of memory?
Thanks.
Andrei
One of the things I have learned about Dojo is that the source code is a great reference.
My quick inspection of dojo/io/script.js shows that there is some logic involving dead code tags and destroying script tags so I guess it should protect against the memory leaks you mention. (Of course, you should always test this kind of stuff yourself, just to be sure).
I've been asking myself this question for quite a while. Maybe someone has already done some digging (or is involved in WP) to know the answer.
I'm talking about storing objects from WP-functions in PHP variables, for the duration of a page load, e.g. to avoid having to query the database twice for the same result set.
I don't mean caching in the sense of pre-rendering dynamic pages and saving them in HTML format for faster retrieval.
Quite a few "template tags" (Wordpress functions) may be used multiple times in a theme during one page load. When a theme or plugin calls such a function, does WP run a database query every time to retrieve the necessary data, and does it parse this data every time to return the desired object?
Or, does the function store the its result in a PHP variable the first time it runs, and checks if it already exists before it queries the database or parses?
Examples include:
wp_get_nav_menu_object()
wp_get_nav_menu_items()
wp_list_categories()
wp_tag_cloud()
wp_list_authors()
...but also such important functions as bloginfo() or wp_nav_menu().
Of course, it wouldn't make much sense to cache any and all queries like post-related ones. But for the above examples (there are more), I believe it would.
So far, I've been caching these generic functions myself when a theme required the same function to be called more than once on a page, by writing my own functions or classes and caching in global or static variables. I don't see why I should add to the server load by running the exact same generic query more than a single time.
Does this sort of caching already exist in Wordpress?
Yes, for some queries and functions. See WP Object Cache. The relevant functions are wp_cache_get, wp_cache_set, wp_cache_add, and wp_cache_delete. You can find these functions being used in many places through the WordPress code to do exactly what you are describing.
I have been looking into AJAX technologies for my company recently. I am having trouble deciding between CFAjaxProxy and a Javascript (we use jQuery) call. IMO CFAjaxProxy is extremely easy to implement and jQuery is a little harder. Is there much performance difference between the two? Are there overheads that I might have overlooked? Are there any other options available for a ColdFusion environment?
EDIT
I don't know if i made my self clear. I was wondering whether CFAjaxProxy or javascript's XMLHttpRequest() object or jQuery's $.ajax() call is the best.
The answer is "Yes". Use both :). I use cfajaxproxy to get easy access to my CFCs, and I use jQuery to take the data that's returned and manipulate it to adjust the UI. You can see an example of that at http://www.lakehousesofamerica.com/america/searchforlandbymap.cfm. I use cfajaxproxy to pull data from a CFC that pulls properties from our database based on the viewport of the map. I then use custom javascript and jquery to manipulate the map based on those return values.
$.ajax() is a wrapper around the HTMLHttpRequest() object. I believe this is also true of CFAjaxProxy at a low level.
I don't think there is actually a "best" to this question. Personally, I use jQuery and $.ajax() more than either of the other solutions simply because it is the most portable (It doesn't care what it is talking to). Not a big fan of tying front end operations to the backend system, personally.
Whichever solution you choose make sure that you research the security implications it presents so you aren't opening your system up to much.
You have more control with jQuery as well as it scales better and you can always hit a CF page or a CFC, you can use jSon to serialize objects between server and client side. My team wrote a new feature we could of used anything we wanted, the pattern we chose was use jQuery for all Ajax communication between the UI and server side, the implementation was swift and can scale for many other platforms not just CF. We could swap out the server side at anytime, and the transition would be seamless.