Best way to show "live" comments

I want to show user comments in a grid (easy enough) but I want to show the new records as they come in as well. In theory, the user stays on this page a while, adding their own comments and viewing others' as they come in.

It behaves very much like a chat window with multiple users making comments, though I don't expect it to be as active as one (I expect it to be about as intermittently-updated as a Facebook wall)

I've considered: - jQuery+AJAX+Timer?

- Web 开发者_高级运维Sockets. Are Web Sockets ready for prime time? And can Web Sockets be implemented with ASP.NET + IIS?

I'm looking for a solution that is elegant, clean, fast (low bandwidth; only load the new comments if possible, popping off the older ones) and not so esoteric on an ASP.NET/IIS platform...not sure how to go about this, kindly requesting your help.

Thanks!

PS I tried searching on "comment system" "show new records" "chat systems", but couldn't quite hit the results I sought.

---

Someone else may have a better example, but I was playing around with a AJAX chat web app. Here's what I did using ASP.net and JQuery.

<script type="text/javascript">
    $(document).ready(function () {
        $("#btnSend").click(function () {
            addMessage();
        });
        return false;
    });

    function refreshChat() {
        $.get("messages.aspx", function (data) {
            $("#chatbox").empty();
            $("#chatbox").prepend(data);
            var $t = $("#chatbox"); //whatever the selector you use.
            $t.animate({ scrollTop: $t.attr("scrollHeight") }, 3000);
        });

        setTimeout(refreshChat, 5000);
    }

    function addMessage() {
        $.get("messages.aspx", { usr: $("#usr").val(), msg: $("#msg").val() });
        $("#msg").val('');
        $("#msg").focus();
    }
</script>

HTML:

<div id="input">
    username:
    <input type="text" name="usr" id="usr" /><br />
    message:
    <textarea rows="3" id="msg" name="msg"></textarea>
    <br />
    <input type="button" id="btnSend" name="btnSend" value="Send" />
</div>
<div id="chatbox" style="height: 300px; overflow: scroll;">
</div>

Use the message.aspx to record new messages into a database and query for new records to add to the msg div.

---

Try this

var interval=2; // on page load

ajax syncing with server for every 2 seconds and on mouse || keyboard event reset interval to 2 and every 10 ajax calls increase the refresh interval by 1 sec. This way you can control server load. and will save bandwidth for client and server.

These values can be adjusted as per your needs