JavaScript vs PHP in sorting an array - javascript

I am getting the information from the user. Then I am to sort the information (Alphanumerically), and give it back to the user again, hence not saving it to the database.
I am able to use either JavaScript (you could even count on jQuery), or PHP to do the sorting. Since the data might contain many lines, I am wondering about approaches below for the sorting:
let's say I tokenize all the lines using an array called lines
in JavaScript lines.sort();
in PHP sort($lines);
I am very keen to know if client-side or server-side would be doing this any differently, mainly in terms of speed. Also, if accuracy is important, then would they be any different at all? Please explain why.

1) jQuery sort() is speedy as it has client side load.
2) For server side sorting we need to find from whole data not only from display in current page for pagination.
For Server side sorting is best for:
Large data set
Faster initial page load
Accessibility for those not running javascript
Client side sorting is best for:
Small data set
Faster subsequent page loads
Ability to let the user sort without loading page
That makes difference between server side sorting and client side.

It would depend on the situation. Javascript means client side load. So if the client has a slow system it might take longer. But server side means you would have to get the data into php (either database or by request etc.) and after the sort back to the client.
One other thing to think about is that php is controlled. You can assure the output is the same. In Javascript it should be the same on every system. But different browsers could generate different results on sort.

Related

Both client-side and server-side validation for my game

I'm making a multiplayer game, where players (1 up to 4) put items on the board (multiple items per move are permitted) one by another. The game is ajax-based. The rules of placing items on the board are pretty complicated, plenty of combinations are forbidden.
What I want to achieve is performing moves validations immediately when player places his item on the board, so there's no lag. He knows if his move is valid or not in no time. Then, the same rules are being checked on server-side, once the move is submitted. This is of course for security reasons, to deal with ajax spoofing. What I'm sending in the request is just a map of items IDs and fields indexes. On the server I'm checking tons of stuff, including whether all those items belong to the player who is permitted to move now and if those items can be put on these particular fields.
I'm thinking about the best practice to validate fields indexes. Now, I have two completely separate scripts, JavaScript one and PHP one. Is there any way to make it more flexible, so if I decide to change the rules, I could change it on both sides? I know I could do some rules mapping object and then write interpreters for both sides, but those rules are too complicated to work with any map like that.
Just a thought.
You could write all your game rule logic in a separate Javascript file in an easy to consume way.. Since this can be run on the client side that problem is out of the way.. And then using this (se link) PHP functionality call the same javascript code from within PHP and test moves for validity.
http://php.net/manual/en/v8js.examples.php
This way you can write your rules once and run them on both sides without having to rewrite them.
If you cant do something like this I would make the server calculate all possible moves for each game piece at the start of each round and send them to the client to present as possible actions. This way you client has no game logic but can still present valid moves without making queries for each one.
This also has the benefit of only having your rules on the server side and not letting people in to the details of how you are checking them.

Ajax - best technique for processing large amount of data

I would like to know, what's the best method to retrieve and use a large amount of dynamic data.
For example:
I have a big website with a lot of fields, which dynamically create popups. The popups are created with a Javascript template engine, which needs JSON encoded data.
Now what I can do:
Every time i request a popup, the client fetches the JSON data via AJAX
I can create a Javascript var via PHP, which stores the data for all possible popups in the HTML code
Or I can fetch the data via AJAX and cache it, in a Javascript var
So which one of these is the best one?
What are the disadvantages of them?
Or how would you attach/load the data for these popups?
BTW does anybody know why all the facebook popups are so smooth? It seems that they are created asynchronously, but they are so fast - like they were already embedded.
Pre-emptive caching.
Basically your 'pop-ups' (god knows why you have so many - there must be a better way :-D hehe) will have a pattern or logical order or whatever.
Using a combination of:
Loading the Main / Most likely to be first used pop-ups data and storing that in a var.
I would highly recommend trying to do this with JSON or similar and store data for 10-20 pop-ups together - downside is performance - have to parse whole file for 1 pop-up (but modern browsers / PCs - not much issue) - plus side number of http requests - the killer of site speed.
You COULD** start loading data for a button etc. on HOVER (as well as click) - milliseconds make prizes you know!
Finally - just ajax the data in and keep it small - the more you can strip out of the ajax call and pre-load (image sprites on page load etc. etc.) the faster your site will respond.
However without knowing:
how often the data will update
what sort of data you are sending (is it all graphs, all text etc.)
how many of these pop-ups you have
how often a new pop-up will be loaded
what device(s) you users will be using
etc.
I can only give wild stabs in the dark!
I am working on the same thing now and find a good introduction blog http://blog.mariusschulz.com/2014/02/05/passing-net-server-side-data-to-javascript, hope it can give you some suggestions.

Is it more efficient to let ajax get the html or get JSON and make the javascript create the html

The title says it all, but basically I use ajax to get information and I don't know if I should have PHP create the HTML which then gets returned to the client and then javascript just plugs it in or if I should have the server just send all the information through JSON and have javascript (jQuery) create all the html that holds it.
Which one is more efficient?
Thanks
I would say it is better practice to serve only the JSON data. Why?
Well, perhaps, you want to hook up a different type of client to your data service.
Maybe you create a mobile app, and it needs the same data, but wants to display it differently.
If you are providing the HTML markup as well, then now your mobile app has to parse the data it wants out of the HTML structure, rather than just dealing with the data right away.
On an efficiency scale, that depends on what you consider efficient.
For example, it would be efficient from a bandwidth perspective to only send the JSON. However, it would be more efficient from a processing standpoint on the target client to simply give it an HTML string to display.
If you are considering ever having different clients accessing the same data, though, then you want to create a single data interface that serves JSON (in your case), and allow the client to decide how to present that data.
Separation of concerns.

Javascript/jQuery tree renderer

I need some help in choosing a "tree renderer" similar to jsTree. Since my requirements might be a little different, I would like to ask you to recommend a (preferably jQuery based) plugin for me.
I am trying to (re) write an organization browser, which shows who reports to who etc. The catch is that my server can only throw back JSON (or whatever format) one time to the client. That is, on page load, my HTML would have a JSON map containing about 2000 employees, and jsTree/whatever-solution-you-recommend, would render this as a tree.
By one-time, I mean that the client JS cannot repeatedly / progressively ask the server for more data in an AJAX-y fashion. (This is due to some complexities at the server side).
Do you think jsTree is fit for this? I don't want the entire user experience to become sluggish with a 1500-2000 employee org-chart (2000 is the limit here).
Any pointers would help, thanks!
you can try jQuery plugin
Plugins/Treeview/treeview
http://docs.jquery.com/Plugins/Treeview/treeview

Dynamic filtering, am I doing it wrong?

So I have an umbraco site with a number of products in it that is content managed, I need to search/filter this dataset on the front end based on 5 criteria.
I'd estimate I will have 300 products. I need to filter this data very fast and hide show options that are no longer relevant based on the previous selections.
I'm currently building a webservice and jquery implementation using AJAX.
Is the best way to do this to load it into a javascript data structure and operate on it there or will AJAX calls be fast enough? Obviously this will mean duplicating the functionality on the server side for non-javascript users.
If you need to filter the data "very fast" then I imagine the best way is to preload all the data then manipulate it client side. If you're waiting for an Ajax response every time the user needs to filter the data then it's not going to be as fast as filtering it on the client (assuming they haven't got an ancient computer running IE6).
It would depend on the complexity of your filtering. If all your doing is showing results where, for example, the product's price is greater than $10, then that will definitely be much faster. If you're going to be doing complex searches then it's possible that it could be faster to process serverside. The other question is how much data is saved for each product - preloading a few hundred products with a lot of data may take some time.
As always, the only way you'll truly be able to answer this question is by profiling the two solutions.

Categories

Resources