The demos that I’ve seen don’t use real-time data so I thought I would create a small demo using real-time tweets being pushed through Kwwika. I updated the Kwwika TweetStreamer component (which I must get around to putting in GitHub) to push through updates from some popular hashtags including #nowplaying, #news, #tech and a few others and then wrote a bit of code to count the number of tweet updates over an interval and push that value into a Smoothie chart. The result looks like this (Smoothie charts use Canvas so only work in some browsers. I’ve tested this demo in Firefox and Chrome):

You can see the Smoothie Twitter Real-Time Charting demo using Kwwika here: http://kwwika.com/Standalone/Demos/javascript-examples/smoothie-twitter-charting/

I’ve got the Smoothie chart showing the number of updates for each twitter hashtag, a table showing the count and a list of the tweets at the bottom.

The code is in GitHub so feel free to fork/download and have a play yourself. You can run the code on http://localhost but in order to get the code to work on your own website you’ll need to register with Kwwika and get in touch to let us know you want access to the real-time Twitter hashtag topics.

Update: We found a bug in the Smoothie library which Joe Walnes promptly fixed.

One thing we’ve noticed is that the Smoothie chart stops working and throws an exception and as yet we’ve not been able to work out what the problem is due to lack of time. It’s probably something to do with not getting any updated values in a TimeSeries. This is what the exception look like in Firebug:

If anybody can work out what the problem is please let us know. Failing that we’ll look into it when we can.

Permalink

| Leave a comment  »

Related posts:

1. Kwwika-Superfeedr real-time demo available
2. Kwwika World Cup 2010 Real-Time Push Web App – Apple iPad competition
3. #LeadersDebate demo retrospective

The understood benefits

The cost and resource benefits that real-time push bring start to be considered when the excitement of the technology dies down and you start talking in detail about using a Cloud Platform as a Service (PAAS) such as Kwwika. Kwwika provides the more obvious benefit of allowing anybody to publish and add real-time data to any web page, web application, Rich Internet Application (RIA), desktop or service application and share information between all these and from a number of different sources. The first thoughts of resource and cost saving are when you start to consider that by using a service you don’t need to buy servers to host your real-time push servers, you don’t need to spend time and effort installing, setting up and learning how to use the software, you don’t need to worry about maintaining the software and handling upgrades and you don’t need to worry about how you deal with scaling your servers to meet increased demand as well as keeping resource usage to a minimum during lean spells. Kwwika offers all the benefits of a hosted scalable service, but for real-time push streaming as a service. This means you can concentrate on building your application, developing your product or service and winning business.

The benefits of real-time push-once

The best way to understand one of the fundamental, but as yet hidden, benefits of Kwwika, and ultimately real-time push-once, is through an example:

Imagine a website known as the best destination for up to the second sports information for the newest and most popular sports of all time: Multiball. It’s a mixture of all the most popular sports including football (soccer), baseball, basketball, rugby, tennis, cricket and motor sports. This new game is fast paced and jam packed with statistics which change every second. Today there is a really big game on between Great Britain and USA. The world wants to watch this game but it’s during the day for many people who will be at work in front of their computers so they’ll be logging on to this well known website to keep up to date with the scores. The game is tied in the 4th quarter with only 1 minute remaining and millions of users from around the world starting hitting the F5 key and clicking the “Refresh” button in their web browser to refreshing the website and check for the latest score. The servers hosting the website can’t handle the load and crash.

Some websites try to get around this scenario by adding some script to their score web page which polls the server for an update at a set interval. The problem with this is that the web server still has to deal with, in effect, a refresh although the data returned to the request can be much smaller.

The most obvious use of a real-time push system is that as soon as a server (or score system) receives new information it can push it to any application instance that is interested in that information. In the above Multibal’ website example the application instance is each web browser session logged on to the website. If the sports website were using a real-time push system this would mean that they could instantly push any changes in the score to each web browser session which would mean that each website user wouldn’t need to refresh their page (reloading the whole page) to check if the score had changed.

This alone would take a massive load off of the sports website infrastructure, but it’s possible to take things even further.

Even in the real-time push scenario the sports website would need to build and maintain the real-time push infrastructure and push an update to each of the millions of website users. From the information above you’ll know that real-time push services can help them out with the infrastructure. The new, and game changing feature that Kwwika offers is that when Rooney Giggs McFadden makes that game winning manoeuvre-score for Great Britain the sports website would only need to publish the score update once into the Kwwika service (real-time push-once). Kwwika would then instantly distribute that update to the millions of website users. This means the website only ever needs to deal with single page loads from its users and push out each score change or game statistic once, Kwwika does the rest.

Thanks to Zen Elements Web Design & Development for the diagrams

Permalink

| Leave a comment  »

Related posts:

1. Add real-time news to your site with Google. Add any real-time data to your site with Kwwika
2. The death of “F5″ Ah, I get it!
3. Kwwika World Cup 2010 Real-Time Push Web App – Apple iPad competition

The demo itself took a couple of days to build and allows a user to subscriber to any RSS feed or track any keyword using Superfeedr. When Superfeedr receives a real-time update it’ll push that update to a web server which will then instantly push that update through Kwwika and into the demo web application.

RSS source → pubsubhubbub → Superfeedr → pubsubhubbub → webserver → Kwwika → Web client

The application shows RSS and track updates in real-time in a web client which you could think of it like a real-time push RSS reader. We’re hosting the application and are restricting the demo to 10 subscriptions unless you have logged in to use your own dedicated demo. If you want your own dedicated demo then you’ll first need a Superfeedr account and then get in touch with us at Kwwika and we’ll set up the demo account for you on our servers. Once that’s done you’ll be able to log into the demo using your Superfeedr credentials. More information on setting up a dedicated demo can be found on the Kwwika Wiki.

If you are a developer you’ll be pleased to know that the the source code for this application is available on GitHub. The code is an ASP.NET MVC solution although you could easily take the principles and create the demo in almost any other language. Just get in touch if you are interested.
It’s also important to remember that this is a pretty simple demo and that this technology has a lot of potential. Even this demo can be improved in terms of usability, feed parsing to ensure all the information a user could need is pushed through, pulling in older feed items from some of the subscriptions, pausing updates, some general UI updates (which are in the pipeline) and so much more. Why not take the code and see what you can do with this? We’d be happy to help!

Here’s a little walk through of the demo:

So, why not try out the Kwwika-Superfeedr demo and let us know what you think.

Permalink

| Leave a comment  »

Related posts:

1. Real-time News Reader Shows Off Push-to-Browser
2. Basic Authentication against the Superfeedr HTTP PubSubHubbub API using a .NET HttpWebRequest
3. Kwwika World Cup 2010 Real-Time Push Web App – Apple iPad competition

The following day I was looking through our website stats and noticed a few hits from an article on the Innovation Focus Scotland site with the title “The death of F5“. It honestly took me about 10 seconds of repeating to myself “the death of F5″, “the death of F5″, “the death of F5″ and then I twigged. When discussing Kwwika to Jane I explained real-time push using a common scenario:

When you go to a website with “live” information, such as a sports scores or frequently updating news site, and you want to check to see if things have updated you quite frequently refresh the page every so often, using the “F5″ key, to see if any new information is available. If that website used Kwwika the website user wouldn’t need to refresh the page. That page will always be up to date, to around 500 millisecond, with any new information that has been pushed through Kwwika and into the web page.

Sometimes I’m so engrossed in the technology that even though you use this scenario all the time, to highlight a simple and fundamental benefit to the user of real-time push, you forget just how beneficial it is to the user experience. It’s a pretty simple concept and it really will lead to “the death of F5″ since there will be no need for a user of a standard website to refresh the page once real-time push is introduced to it. F5 will be left to be used by developers who want to check the impact of their code change on their web page or application. Will the refresh button disappear as one of the main buttons in a web browser?

A big thanks to Jane for the article and for reminding me about a fundamental benefit of Kwwika and real-time push.

Permalink

| Leave a comment  »

Related posts:

1. The benefits of Real-Time Push-Once
2. Add real-time news to your site with Google. Add any real-time data to your site with Kwwika
3. Kwwika-Superfeedr real-time demo available

So, if you want to try out the Kwwika JavaScript API but don’t want to register (yet), then go ahead. There’s a topic that you can subscribe and publish to named /KWWIKA/SANDBOX.

You can even start building a Kwwika World Cup 2010 Real-Time Push Web App because we’ve give http://localhost access to the data you need to use to enter the competition:

• /OPTA/WC2010/TEAMLIVE
• /KWWIKA/TWITTER/SEARCHES/WC2010/*

If you need help getting started you can of course get in touch or start by going through our Real-Time Web Workshop. This workshop contains a presentation, a set of exercises and all the files (download) that you need to go through the exercises. This even in includes and executable webserver to run on windows, a webserver app to run on Mac and a python webserver to run on Linux (or any other python enabled machine).

So, why not start developing using Kwwika now. And if you like it, or are just damn good at developing real-time push apps, why not register and enter our World Cup 2010 competition.

Permalink

| Leave a comment  »

Related posts:

1. Kwwika World Cup 2010 Real-Time Push Web App – Apple iPad competition
2. Anybody fancy a real-time web workshop?
3. Kwwika-Superfeedr real-time demo available

The jQuery Real-Time Push Kwwika Plugin allows you to define elements within a web page that you want to be updated with real-time data as soon as it’s available. Anybody that has used a jQuery plugin should find our jQuery plugin really simple to use.

Here’s how to use it.

Register for the Kwwika Beta

In order to use Kwwika you must first register so we can set up permissions within the Kwwika system to allow your website/domain to receive real-time push data from Kwwika.

So, register for the Kwwika Beta programme now.

Include script tags

You need to include the core jQuery library, the Kwwika JavaScript API and the jQuery Real-Time Push Kwwika Plugin files in your web page:

<script src="http://code.jquery.com/jquery-1.4.2.min.js"></script>
<script src="http://api.kwwika.com/latest/"></script>
<script src="http://api.kwwika.com/latest/plugins/jQuery/jquery.kwwika/jquery.kwwika.js"></script>

Define HTML

You define the topic to be requested from Kwwika by adding an attribute to an HTML element. The default attribute to identify the topic to request is data-topic. You identify the value to be placed within the element by adding a data-field attribute to the same element. In the example below if an update occurs on the /KWWIKA/TWITTER/SEARCHES/KWWIKA topic with a value for the ScreenName field it will be inserted as the html contents of the first <div> element.

We’ve decided to use attributes with a prefix of “data-” as the present HTML 5 draft suggests custom attributes should use this prefix.

Custom data attributes are intended to store custom data private to the page or application, for which there are no more appropriate attributes or elements.

<html>
    <body>
        <div data-topic="/KWWIKA/TWITTER/SEARCHES/KWWIKA"
     data-field="ScreenName"></div>
        <div data-topic="/KWWIKA/TWITTER/SEARCHES/KWWIKA"
     data-field="Text"></div>
    </body>
</html>

Call the jQuery plugin

You call the jQuery Real-Time Push Kwwika Plugin in the same way you call any other jQuery plugin, by supplying a selector to the jQuery method ($) and calling the kwwika() function.

<script type="text/javascript">
    $(function ()
    {
        $("div").kwwika();
    });
</script>

Examples

You can find three examples of how to use the jQuery Real-Time Push Kwwika Plugin from the links below:

The jQuery Real-Time Push Kwwika Plugin examples can be found on the API site:
http://api.kwwika.com/latest/plugins/jQuery/jquery.kwwika/examples/

Plugin Files

The plugin files are hosted on our API server. You can either download them and host them yourself or your own server:

Min: http://api.kwwika.com/latest/plugins/jQuery/jquery.kwwika/jquery.kwwika.min.js

Full: http://api.kwwika.com/latest/plugins/jQuery/jquery.kwwika/jquery.kwwika.js

Plugin Web Page

The jQuery Real-Time Push Kwwika Plugin has a dedicated page on the Kwwika Wiki:
http://wiki.kwwika.com/plugins/jquery-real-time-push-kwwika-plugin

Permalink
| Leave a comment  »

Related posts:

1. Kwwika World Cup 2010 Real-Time Push Web App – Apple iPad competition
2. Kwwika World Cup 2010 Real-Time Push Web App – Apple iPad competition – Sponsored by TellyLinks.com (Update)
3. Chrome/Safari (webkit) + real-time push = always loading indicator

The BBC have adapted their standard look and feel to incorporate a video or audio component for their BBC World Cup 2010 presence. They also got a "live" commentary section, some team information and match stats. The commentary updates every 30 seconds. Updating every 30 seconds just isn't good enough. I want to see comments appear about the event that is happening now, not 2 minutes ago!

The ITV Live application has a lot going on. They've thrown in textual updates, facts, video replays, statistics and polls. I like the facts and the replays but the main failing on ITV Live is that you just don't feel that you want or need to stay on the website. It's not adding a lot of value to the World Cup experience. More needs to go into the "Get Involved" section as you can see from the screenshot below.

I quite like the Fifa application although it doesn't add much to the experience if you are also viewing the games live on television until you scroll down the page and see the "Have your say", "Fantasy", "Head-to-Head" stats and live groups standings section.

I'm really disappointing with the Twitter World Cup 2010 application. They've probably got more data than anybody else but the problem is they're not doing enough analysis on it, or giving the user the opportunity of doing some filtering. The data isn't real-time and you would have thought that they would be able to afford to put some effort into the application. We've thrown together a real-time application for the World Cup in a couple of hours to show off all the #worldcup tweets in real-time. At least our application has a bit of impact.

Now, to get to the point. All these big players have come up with an application for the World Cup but we're sure that developers out there could come up with something better. If you feel you could develop a better real-time World Cup 2010 application then why not enter our Kwwika World Cup 2010 Real-Time Push Web App competition? We will make all #worldcup tweets available to you and will also be adding some world class World Cup statistics data for you to use within you application. The developer who builds the best application will win an Apple iPad.

Go on, enter our competition and show BBC, ITV, Fifa and Twitter what a quality World Cup application should look like.

Permalink

| Leave a comment  »

Related posts:

1. Kwwika World Cup 2010 Real-Time Push Web App – Apple iPad competition
2. Live Mesh – my experience
3. Add real-time news to your site with Google. Add any real-time data to your site with Kwwika

We are opening up a competition to give all you web developers the chance to win an Apple iPad with Wifi 32GB by creating the most engaging and “cool” real-time push web application using Kwwika. Let your imaginations run wild and mash up the data you receive from Kwwika in real-time with other sources of data such as Google Maps, You Tube, Google search, Flickr or any other API you can get your hands on.

We’ve created a very simple real-time push World Cup 2010 demo to give you an idea of the type of things you could create. We’re sure you can do better! View the demo.

At the moment we are pushing real-time updates from Twitter but we have a MASSIVE announcement to make when we will be adding real-time updates from a major sports data distributor. Follow Kwwika on Twitter to keep updated.

Still here! What are you waiting for? Get started building your Kwwika World Cup 2010 Real-Time Push Web App and win an iPad.

Permalink

| Leave a comment  »

Related posts:

1. Want to try out the Kwwika API but don’t want to register?
2. Kwwika-Superfeedr real-time demo available
3. Add real-time news to your site with Google. Add any real-time data to your site with Kwwika

See and download the full gallery on posterous

It makes sense that webkit-based browsers do something to detect if a page has loaded and then stop displaying the loading indicator. However, it’s still a bit unclear what determines if the loading indicator will be shown when a streaming connection is established from JavaScript. Following a bit of googling and some tinkering it would appear that you can stop the loading indicator if you establish your streaming connection after all other page content has loaded. Oh, it’s easy then? Nope! Determining when all page content has loaded doesn’t appear to be as simple as you would think.

To save some time I tried establishing my streaming connection to Kwwika at different points in the page loading process using the jQuery library:

1. DomContentReady via the .ready() jQuery function (also see $(calback))
2. window.onload via the .load() jQuery function

Google Chrome
When connecting within the .ready() callback the loading indicator would always appear.
$(document).ready(function()
{
var oConn = kwwika.Service.connect();
});
However, if you use the .load() callback 99% of the time the loading indicator would disappear after the page was loaded and then the real-time push connection would be established.
$(window).load(function()
{
var oConn = kwwika.Service.connect();
});

Safari
In Safari the results when using the .ready() callback were exactly the same.

For the .load callback I had to introduce an additional wait using window.setTimeout in order to lose the loading indicator.
$(window).load(setTimeout(function()
{
var oConn = kwwika.Service.connect();
}, 10000));

If the .load() solution worked for both webkit-based browsers then I’d be happy to say that this problem has been resolved. However, having to add a random timeout to lose the loading indicator in Safari means that, for now, I think this is going to be a continuing annoyance for developers and will also impact the real-time push web application user experience by suggesting to users that the web application has not fully loaded.

Permalink

| Leave a comment »

Related posts:

1. The benefits of Real-Time Push-Once
2. Kwwika World Cup 2010 Real-Time Push Web App – Apple iPad competition
3. Drag Drop bug in JQuery UI 1.5.3

However, why restrict yourself to just news updates when there are services such a Kwwika that allow you to add real-time push containing any data to your website!

If you have data that you want to push your data in real-time then you can use Kwwika to easily and instantly distribute your data to thousands of users. This can be great for showing the quality of your data and proving you use the most up to date technologies to give your data consumers a massive advantage. If you want to add real-time data to your website then you can easily subscribe to data and have it update instantly in your website.

Why not get in touch with Kwwika or sign up for the beta programme and see how you can either real-time push your data or add real-time push to your website, Rich Internet Application (RIA) or desktop application.

Permalink

| Leave a comment  »

Related posts:

1. The benefits of Real-Time Push-Once
2. Kwwika World Cup 2010 Real-Time Push Web App – Apple iPad competition
3. Kwwika-Superfeedr real-time demo available