Coded something up in Couch in an interesting way? Have a snippet or shortcode to share? Post it here for the community to benefit.
2 posts Page 1 of 1
Page load times when not using the cache are a little slow (circa 70ms for me on a page with 3 editable text regions and not a lot else).

Cache enabled they're much much snappier of course.

Problem is, quite a lot of times you might want to have something dynamic on an otherwise static page and it's a shame to force a page not to cache just for one small content item (eg a 'current time' display or a page view count etc. Unsure if there's an 'official' CouchCMS solution to this - I couldn't find one if so. Here's the way I've solved it using cross-browser compliant asynchronous ajax that doesn't require jquery or anything else - just uses native code....

1. Stick an identified DIV in your page where you want the dynamic content to go. Give it any unique ID you like.

Code: Select all
<div id='dynamic_content'>Loading...</div>


2. Put the following javascript on your page somewhere, between the CouchCMS include and invoke PHP code, but AFTER the div you added above.

Code: Select all
<script>

function updateDynamicContent (html)
{
    document.getElementById('dynamic_content').innerHTML = html;
}

function AjaxWN(url, notify)
{
    var axmlHttp = null;   
   
    try
    {
        // Firefox, Opera 8.0+, Safari, IE7
        axmlHttp = new XMLHttpRequest();
    }
    catch(e)
    {
        // Old IE
        try
        {
            axmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
        }
        catch(e)
        {
            alert ("Your browser does not support XMLHTTP!");
            return;
            // Do what in this scenario then? Their browser does not support Ajax
        }
    }
   
    if (notify != 0)
    {
        axmlHttp.onreadystatechange=function()
        {
            if (axmlHttp.readyState==4 && axmlHttp.status==200)
            {
                window[notify](axmlHttp.responseText);
            }
        }
    }
   
    url=url+"&sid="+Math.random();
    axmlHttp.open("GET",url,true);
    axmlHttp.send();
}

// ? on end of ajax URL is important to force no caching by browser
AjaxWN('/get-dynamic-content.php?', 'updateDynamicContent');

</script>


3. Finally create the following PHP script and call it 'get-dynamic-content.php' (or whatever URL you put in your AjaxWN call).

Code: Select all
<?php
echo rand();


Refresh the page as admin as usual, SAVE it, then refresh a few times in a browser you're not signed in as admin... the page content is all cached (assuming you turned on caching in CouchCMS config.php) but the little bit you added is now loaded dynamically when the page loads.

Very easy to also add additional dynamic content to the same page by simply adding another div with another unique ID, creating a PHP (et al) handler for the ajax call and a new function to inject the received content into your page.


The way this works is to keep the entire cached page still static and cached as before, but in that cached page now is javascript code which runs in the user's browser, to pull in specific content and update the page in the appropriate page if and when that content is ready.
Nice trick, Bob! Thanks!
2 posts Page 1 of 1
cron