ansaurus

Question

Keep a permanent connection to the server while navigating a website

Answer 1

+1 A:

Though this might not be a complete rewrite I'll say it will take some doing. Have the Chat box stay there and ajax in content, i.e. if, like on facebook the bottom has the chat bar, section the rest in an id you ajax you pages into. In other words, take the chat out of your layout, put it separate, and make your links into ajax requests which can be handled via a global link handler and links substituted via a search a replace over all files via sed. (href=" changed to href="javascript:urlhandler( but this will need to account for external links) The other option I can think of is having two iframes on your site. Main and chat. And provide Session cookies for those who navigate from the page, D/C or whatever will happen to them.

Chisum 2009-11-17 00:56:13

Thanks for your comment, regarding to the first solution - its pretty much what I was referred to as 'anchor based navigation' - minus the anchors that will indicate which is the current page (similar to the navigation in Facebook/Gmail) - if I'll handle all links via JS code, and stay on the same page 'forever' - I'll still have the problem that I've mentioned before - The URL will always stay the same, and it will result problems when refreshing the page/navigating back-forward/bookmarking an page)... also, this solution will require some serious changes...

jitzo 2009-11-17 10:51:42

Regarding to your second solution - which was mentioned in the question - it will require much less changes, but it has the same URL's problem...

jitzo 2009-11-17 10:53:32

A quandary good sir, I'll take a closer look, thanks for the info :)

Chisum 2009-11-18 06:36:52

Answer 2

+1 A:

Are you using an implementation of your chat on each page? If so, the answer is to tweak caching for your scripts. Make sure all large JS files are external and that the server registers no changes (e.g.: Last Modified). Combine images into sprites. Run your code through one of the many minifiers that exist. Last but not least, invest in a CDN. Amazon CloudFront is simple and cheap: you'll find that it works wonders for improving performance.

mattbasta 2009-11-17 03:16:38

Answer 3

A:

You can use jquery's history plugin (http://www.mikage.to/jquery/jquery%5Fhistory.html) to handle back and forward navigation and load pages via ajax like you were talking about.

Something like this should work (untested):

Page1.htm:

<html>
<head><title>Page 1</title></head>
<body>
     <div id="content">
         <a href="/page2.htm">Load Page 2</a>
     </div>
    <div id="chat"></div>
</body>
<script>
    $(function(){
        function loadPage(hash){
            if($.browser.msie) {
      hash = encodeURIComponent(hash);
        }
            $.ajax({
                "url":hash,
                "success":function(response){
                     var newPage = $(response);
                     document.title=newPage.find("title").html();
                     $("#content").html(newPage.find("#content").html());
                 }
            });
            return false;
        }
        $.historyInit(loadPage);
        $("a").live("click",function(){
            $.historyload(this.href);
        });
    });
</script>
</html>

Page2.htm:

<html>
<head><title>Page 2</title></head>
<body>
     <div id="content">
         <a href="/page1.htm">Load Page 1</a>
     </div>
    <div id="chat"></div>
</body>
<script>
    $(function(){
        function loadPage(hash){
            if($.browser.msie) {
      hash = encodeURIComponent(hash);
        }
            $.ajax({
                "url":hash,
                "success":function(response){
                     // this is just an example and not too efficient.
                     var newPage = $(response);
                     document.title=newPage.find("title").html();
                     $("#content").html(newPage.find("#content").html());
                 }
            });
            return false;
        }
        $.historyInit(loadPage);
        $("a").live("click",function(){
            $.historyload(this.href);
        });
    });
</script>
</html>

If you would like to outsource the work to me I'd be glad to help. :o)

David Murdoch 2009-11-18 15:17:20

ansaurus

tags:

views:

answers:

Keep a permanent connection to the server while navigating a website

related questions