I am working on a project which is built on Springs MVC and Google App Engine with Objectify.
The major functionality of this app is: If someone posts something new to the Datastore then it should be auto published to the browsers to which it is connected without refreshing the page content. Basically it is a news like site. The data sent to browser is REST APIs based JSON Data.
For implementing this functionality I thought of using the following ways:
AJAX : I thought of using AJAX call in every 2-3 minutes to get updated. But this solution doesn't seems to be feasible as there are many datastore read operation due to many AJAX calls from many browsers.
Web Socket : This concept is pretty new to me. I am not aware of this thing. Some pusher.com uses this technology for establishing such connections.
Now I need your suggestions, using which of the two above or I am also open to other solutions.
Google app engine does not support web sockets, however it supports something similiar called the channel api which works on older browsers as well. This may not be feasible depending on how many people you will have connected (channels cost 1c per 100). Channels also have some caveats: https://developers.google.com/appengine/docs/python/channel/overview#Caveats
As for using Ajax - if you cache the response in memcache and flush the key every 3 minutes then you won't be doing any data store reads unless a new instance is fired up or the key expires.
Related
We are developing a social networking iOS application. The application loads lots of data from back end server. I have following doubts which is still unclear .Please help
What is the best approach for handling these much data from back end server?.
How does social networking mobile applications like facebook loads and update friends data?
Does these kind of application uses a local database to store these data?? If so when is the values in the local database updated?
Is making an synchronous call on a separate thread same as making an asynchronous server call?
Please provide your suggestions.Thanks in advance
Ideally, load data "on demand". Request from the server the data the user is seeing at the moment, or that you think she will see soon. Also, request data in batches (for example, last 50 posts, or post between certain dates).
Considering the answer above, Facebook does something similar. The key is to be smart on the server side. Let the client ask for a feed, for example. The server returns the last 50 posts and a "next page" attribute. The client can store that attribute and when the user scrolls down to the last post, send a request to the server asking for more news and passing the "next page" attribute that the server previously returned. The server of course will return a new "next page" with the new request. In this way, what is returned to the client is decided by the server.
Yes, you should use a local database which acts like a client cache. This is used to present the data that was shown to the user the last time she opened the app, so that you can show something while the request is loading from the server. You should update your database when the server sends a response to your request. This is also valid for friend lists, messages, etc. Don't forget, though, that the server has he most up-to-date information and the client database is mostly a cache to display temporary information.
Not exactly the same but for your use case it will be very similar. Ideally some operating systems provide low level asynchronous network operations, which is much better than handling it on your code with a background thread.
We are developing a free, open source Google Reader alternative at http://reader.pykih.com and the code is at http://github.com/pykih/reader
When a user signs up or adds a RSS feed, we add the feed url to the database and then ask a DelayedJob to fetch articles from that RSS url. This typically takes few seconds to minute or two, depending on the DelayedJob queue. Many users have complained that RSS feed is not being fetched at all when in reality it is being fetched. All that the user has to do is refresh his own page. We wrote a message there, yet users are complaining.
Can anyone point us in direction towards - what is the best way to design a Facebook or Google style "Loading" (icon in yellow) functionality and once loaded it automatically adds the entries to the screen without page refresh.
Thank you in advance
If I understand correctly, you basically want to update the user's view of the page while it's still open, in real time. (At any rate, that's what Facebook and most Google products do nowadays). This technique is usually called server push - information is pushed from the server to the client, instead of having the client request (pull) information from the server.
There are multiple ways to implement server push.
You could use AJAX to 'reload' the page every ten seconds or so. This is very easy to implement, but not realtime at all, and could cause unneeded load on your server. It works with all browsers.
You could use EventSource, a relatively new format supported by Firefox, Chrome, Safari, Opera and others (but not IE). It's a very simple format and easy to implement. EventSource is one-way communication only: it sends events from the server to the client, not in reverse.
You could use WebSockets, probably using a library like EventMachine and a WebSocket library. WebSockets allow fast bidirectional communication, but it's more complex than EventSource and only the newest IE versions support it.
You could use a commercial service like Pusher. Pusher is easy to integrate and fast, but not free. Browser compatibility is great, though.
The options differ primarily in the amount of client support (do you need IE support?) and the amount of Ruby integration you get.
I'm just testing out Google Play Music, and noticed that with so much going on on a single page, how come there aren't many XHR requests showing up in the console?
When I create an AJAX site, every single XHR request I perform (usually using jQuery's $.ajax() method) is clearly visible in the console, as expected. But on mainstream sites, even more so with Facebook, there don't seem to be many visible XHR request going on, and they certainly don't seem to be pinging the server every 10 seconds or so to check for new status updates...!
Alternatives I've read about are persistent connections, and dynamically inserting tags into the page which presumably pulls data from other sources making it available in the current page.
I never tried those sites but a common solution, used for example on Stack Overflow, is to use websockets. They enable an efficient pushing of information from the server to the client without polling.
What is the difference between all three? They seem to do the exact same thing. Why and when would you choose to use one method over the other?
AJAX and websockets do similar tasks — they both establish a communication channel to a server. Web workers have nothing to do with either of them, they are just separate threads of JS execution.
AJAX is more mature than websockets — it has been around much longer and has a much wider browser support. AJAX is request-oriented — you make a request to the server, the server responds, and the connection is closed. Websockets on the other hand establish a persistent connection to the server, over which you exchange multiple messages in both directions.
Webworkers are useful if you want to perform a processor intensive task without blocking the browser interface.
They are not same. But one can use them together to build advanced application.
Ajax: As abbrevation States is asynchronous javascript and xml.. is used to load the content dynamically from the server upon called.
Websockets : Websockets is the feature defined in HTML5 . As wikipedia states "WebSocket is a protocol providing full-duplex communications channels over a single TCP connection." so this is mainly used for real time communication such as video call, live chat etc..
WebWorkers : this feature is also defined in HTML5. This is basically used to make bring multi threading feature in Javascript. Since javascript is a single threaded programming language , it breaks or pause whenever i.e heavy calculation tasks are done using it. to overcome this breakage , Webworkers are added to javascript.
You can perform Ajax and Websockets inside Webworkers . however you cannot manipulate DOM using webworkers due to security reasons.
They are not the same.
Ajax: It is a way of interacting with a web server asynchronously from a UI renderer
Web Sockets: An HTML5 feature using which you can interact with any Socket server extending the reach of the browser
Web Workers : Another HTML5 feature that helps you do multi-threaded programming from a web browser using Java Script
Ajax & Websockers are siblings.
Webworkers are completely different.
AJAX
The best example of AJAX is Google's search bar - suggestions appear as you type, but the current webpage is not redirected or refreshed! (10 years ago this was amazing, not so much anymore). This is AJAX in action.
AJAX uses what's called a "request" and "response" model: you ask a question, and you receive an answer from the 'server'.
AJAX allows webpages to talk to "servers" behind the scenes, allowing you to update a webpage without navigating away from your URL. Back in the old days of the web, if you wanted to show different content on a webpage, users would have to navigate to a different URL: not any more. This concept has been taken to the next level with single page apps and applications (like React, Vue, Elm etc.).
Websockets:
With websockets, your web-page talks to your server (as with Ajax), and your server responds - except you do so like you're talking on the phone. There is a "connection" between your users and your server. This "connection" is not there with AJAX: in that case, you have a simple request and a response coming back from the server.
In other words, if you wanted to stream stock market data, constantly updating it to your users: it would probably be better to use websockets, than AJAX.
Web-workers:
Use When you need intensive calculations - if you were to ask a web-page to calculate Pi to 100000 decimal places: that might take a while. The web-page might freeze, and you might lose $$. The intensive calculations can be done in the background, without freezing your webpage. People using your site can do other things - e.g. click around, while waiting for the result in the meantime.
I have found very little on this topic. I'm trying to work out a way to synchronize pages cross-web without having to constantly reload pages to get new information, since the rate at which this would be necessary would cause the page to be outrageously slow.
The flow I'm thinking is this:
User A alters info displayed on Page A.
Page A sends info to server.
Page B checks server for new info every 10ms or 100ms.
Page B loads Page A's new info.
I can see AJAX as being sufficiently fast to retrieve info from the server, but have found no way to send data to a server without having to refresh every 10ms, which, even using an iframe to avoid reloading the whole page, seems far too slow to me. Correct me if I'm wrong.
So my question is, is there any way of which I am unaware to do what I am attempting? I have seen methods involving a Java server applet, but that's a bit above my head at the moment. If that's the only way, I'll learn it, but I'd love to avoid that if possible.
There are two possible interpretations of what you wrote, the first which seems to be what you've actually said is that you want to know how to send data with an Ajax request, the second is that you want to know how to push unsolicited data from the server to the client.
Ajax can easily add data to a request it makes - just add query-string parameters, or make a POST request and use XHR's send method
Use comet - i.e. keep open a long-lived connection and send data only when there is something to send.
One of the possible way to implement what you want is to use Comet technology. For example - facebook uses it to interact with their servers.
If you are retrieving info fast using AJAX, then you are also sending info fast with AJAX...
GET requests are still telling the server something. For example, lookup RESTful web-services.
You could use updater of Prototype.