<?xml version="1.0" encoding="UTF-8"?><rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	>
<channel>
	<title>Comments on: Speeding Up your Application with Javascript Templates (and cjson)</title>
	<atom:link href="http://www.thesamet.com/blog/2007/07/30/speeding-up-your-application-with-javascript-templates-and-cjson/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.thesamet.com/blog/2007/07/30/speeding-up-your-application-with-javascript-templates-and-cjson/</link>
	<description>The Ramblings of a Freelance Software Developer</description>
	<pubDate>Sat, 22 Nov 2008 01:59:19 +0000</pubDate>
	<generator>http://wordpress.org/?v=2.5.1</generator>
		<item>
		<title>By: florian</title>
		<link>http://www.thesamet.com/blog/2007/07/30/speeding-up-your-application-with-javascript-templates-and-cjson/#comment-6627</link>
		<dc:creator>florian</dc:creator>
		<pubDate>Wed, 01 Aug 2007 09:27:54 +0000</pubDate>
		<guid isPermaLink="false">http://www.thesamet.com/blog/2007/07/30/speeding-up-your-application-with-javascript-templates-and-cjson/#comment-6627</guid>
		<description>I don't like JST syntax and I don't like parsing template markup in the browser. Hence I wrote &lt;a href="http://dev.codeflow.org/trac/genshi2js/wiki/WikiStart" rel="nofollow"&gt;Genshi2Js&lt;/a&gt;
 which converts Genshi templates to javascript functions, to which you then feed your data (deserialized json) and out comes html fragments intended for insertion in innerHTML.

You could use it as a compiler on the command line, generating your javascript file, or you could use it as a compiler for handling web-requests for your javascript directly.

(sorry, meant to comment this here, somehow ended up in another post)</description>
		<content:encoded><![CDATA[<p>I don&#8217;t like JST syntax and I don&#8217;t like parsing template markup in the browser. Hence I wrote <a href="http://dev.codeflow.org/trac/genshi2js/wiki/WikiStart" rel="nofollow">Genshi2Js</a><br />
 which converts Genshi templates to javascript functions, to which you then feed your data (deserialized json) and out comes html fragments intended for insertion in innerHTML.</p>
<p>You could use it as a compiler on the command line, generating your javascript file, or you could use it as a compiler for handling web-requests for your javascript directly.</p>
<p>(sorry, meant to comment this here, somehow ended up in another post)</p>
]]></content:encoded>
	</item>
	<item>
		<title>By: thesamet</title>
		<link>http://www.thesamet.com/blog/2007/07/30/speeding-up-your-application-with-javascript-templates-and-cjson/#comment-6624</link>
		<dc:creator>thesamet</dc:creator>
		<pubDate>Mon, 30 Jul 2007 13:29:06 +0000</pubDate>
		<guid isPermaLink="false">http://www.thesamet.com/blog/2007/07/30/speeding-up-your-application-with-javascript-templates-and-cjson/#comment-6624</guid>
		<description>I agree that this approach could be right for simple for-loop templates.  
On the other hand, some applications, may become simpler and faster  (and less lynx or bot compliant) if they outsource the rendering to the client. It is a trade-off.</description>
		<content:encoded><![CDATA[<p>I agree that this approach could be right for simple for-loop templates.<br />
On the other hand, some applications, may become simpler and faster  (and less lynx or bot compliant) if they outsource the rendering to the client. It is a trade-off.</p>
]]></content:encoded>
	</item>
	<item>
		<title>By: guillaum</title>
		<link>http://www.thesamet.com/blog/2007/07/30/speeding-up-your-application-with-javascript-templates-and-cjson/#comment-6623</link>
		<dc:creator>guillaum</dc:creator>
		<pubDate>Mon, 30 Jul 2007 13:09:51 +0000</pubDate>
		<guid isPermaLink="false">http://www.thesamet.com/blog/2007/07/30/speeding-up-your-application-with-javascript-templates-and-cjson/#comment-6623</guid>
		<description>I don't suggest you to rewrite your own server-side templating language, but to stop using kid for specials cases and replace it by a plain for loop, just for critical parts.

I can imagine that in your TG apps, you have a place where your write some code (per haps a plain for loop) to create your JSON output and then insert it in your HTML output ?

Replace it by a loop which generate HTML and insert it in your HTML output ? it's the same job, and you can remove the client part ?

I dont' know how TG really work, but you may have something like that.

output = mykidtemplate.serialize()
http.send_to_browser(output)

replace it by

output = mykidtemplate.serialize()
output = output.replace('PLACEHOLDER_FOR_MY_TABLE',
         mytable_in_html)
http.send_to_browser(output)

No, this juste add some few lines in your application, increase speed and remove the need for client side javascript.

Is there is something that i missunderstand ? (I'm not TG user and not a web develloper :)

And can I remember you that your had write your own custom client-side templating language :)</description>
		<content:encoded><![CDATA[<p>I don&#8217;t suggest you to rewrite your own server-side templating language, but to stop using kid for specials cases and replace it by a plain for loop, just for critical parts.</p>
<p>I can imagine that in your TG apps, you have a place where your write some code (per haps a plain for loop) to create your JSON output and then insert it in your HTML output ?</p>
<p>Replace it by a loop which generate HTML and insert it in your HTML output ? it&#8217;s the same job, and you can remove the client part ?</p>
<p>I dont&#8217; know how TG really work, but you may have something like that.</p>
<p>output = mykidtemplate.serialize()<br />
http.send_to_browser(output)</p>
<p>replace it by</p>
<p>output = mykidtemplate.serialize()<br />
output = output.replace(&#8217;PLACEHOLDER_FOR_MY_TABLE&#8217;,<br />
         mytable_in_html)<br />
http.send_to_browser(output)</p>
<p>No, this juste add some few lines in your application, increase speed and remove the need for client side javascript.</p>
<p>Is there is something that i missunderstand ? (I&#8217;m not TG user and not a web develloper <img src='http://www.thesamet.com/blog/wp-includes/images/smilies/icon_smile.gif' alt=':)' class='wp-smiley' /> </p>
<p>And can I remember you that your had write your own custom client-side templating language <img src='http://www.thesamet.com/blog/wp-includes/images/smilies/icon_smile.gif' alt=':)' class='wp-smiley' /></p>
]]></content:encoded>
	</item>
	<item>
		<title>By: thesamet</title>
		<link>http://www.thesamet.com/blog/2007/07/30/speeding-up-your-application-with-javascript-templates-and-cjson/#comment-6622</link>
		<dc:creator>thesamet</dc:creator>
		<pubDate>Mon, 30 Jul 2007 12:46:07 +0000</pubDate>
		<guid isPermaLink="false">http://www.thesamet.com/blog/2007/07/30/speeding-up-your-application-with-javascript-templates-and-cjson/#comment-6622</guid>
		<description>&lt;p&gt;Your previous comment was waiting in Akismet moderation queue. Probably it suspected it because of its length.&lt;/p&gt;
&lt;p&gt;As your results suggests, Kid is 100 times slower than a manual string crafting string. Well, this means that I'll have to write my own custom server-side templating language. But hey, why should I invent a new server-side templating language if I have kid? :) Back to square 1.&lt;/p&gt;
</description>
		<content:encoded><![CDATA[<p>Your previous comment was waiting in Akismet moderation queue. Probably it suspected it because of its length.</p>
<p>As your results suggests, Kid is 100 times slower than a manual string crafting string. Well, this means that I&#8217;ll have to write my own custom server-side templating language. But hey, why should I invent a new server-side templating language if I have kid? <img src='http://www.thesamet.com/blog/wp-includes/images/smilies/icon_smile.gif' alt=':)' class='wp-smiley' /> Back to square 1.</p>
]]></content:encoded>
	</item>
	<item>
		<title>By: guillaum</title>
		<link>http://www.thesamet.com/blog/2007/07/30/speeding-up-your-application-with-javascript-templates-and-cjson/#comment-6621</link>
		<dc:creator>guillaum</dc:creator>
		<pubDate>Mon, 30 Jul 2007 12:31:00 +0000</pubDate>
		<guid isPermaLink="false">http://www.thesamet.com/blog/2007/07/30/speeding-up-your-application-with-javascript-templates-and-cjson/#comment-6621</guid>
		<description>I made a comment, but it don't appear ? (when i try to resubmit it, i have a warning about duplication, so my comment is on your database, but not displayed)
Where is my comment ?</description>
		<content:encoded><![CDATA[<p>I made a comment, but it don&#8217;t appear ? (when i try to resubmit it, i have a warning about duplication, so my comment is on your database, but not displayed)<br />
Where is my comment ?</p>
]]></content:encoded>
	</item>
	<item>
		<title>By: guillaum</title>
		<link>http://www.thesamet.com/blog/2007/07/30/speeding-up-your-application-with-javascript-templates-and-cjson/#comment-6620</link>
		<dc:creator>guillaum</dc:creator>
		<pubDate>Mon, 30 Jul 2007 12:23:18 +0000</pubDate>
		<guid isPermaLink="false">http://www.thesamet.com/blog/2007/07/30/speeding-up-your-application-with-javascript-templates-and-cjson/#comment-6620</guid>
		<description>And if Kid is really so slow, why not generate the code server-side, but with a traditionnal for loop ?

I think that tools such as kid must not remove for our brain that there is still the "old way".

I ran some tests, with a data set such as:

--------------------
NB_LINES = 1000
a = "hello i'm a french guys".split()
data = [tuple(a) for i in range(NB_LINES)]
--------------------

I use that function to generate the  data:

-----------------------
def XML_from_data(data):
    out = ''
    for line in data:
        out += ''
        for element in line:
            out += '' + element + ''
        out += ''
    return out
-------------------------

This function is really what we must not do if we want speed :)

The function take 0.00541855292977 in my hardware for one transformation of data.

I did 3 tests, one with full kid.
The second with Kid which call XML on the output of XML_form_data
the third one with just a replace() or string formating call on the output of kid and a placeholder for the table:

kid: 1.00006444319
kid with XML(): 0.995648732246
replace methode: 0.0171378728814

So if the XML() method is not interesting, the replace is. I don't know if it's difficult or not to use that solution on TG, but I think that can save you from the use of that JSON big and horrible hack :)

The code, note I love the *enlarge your textarea now* feature :)

--------------------------------------------------------------
import kid
import timeit

NB_LINES = 1000

# data table
a = "hello i'm a french guys".split()
data = [tuple(a) for i in range(NB_LINES)]

src = """

$title

%s


"""

def XML_from_data(data):
    #return '' + ''.join(''.join(line) for line in data) + ''
    out = ''
    for line in data:
        out += ''
        for element in line:
            out += '' + element + ''
        out += ''
    return out
    


solution1 = src%'''$elem'''
solution2 = src%'''${XML(data)}'''
solution3 = src%'''%(data)s'''

print timeit.Timer('kid.Template(source=solution1,data=data,title="test1").serialize()',
                   'from __main__ import solution1, data;import kid').timeit(1)
print timeit.Timer('kid.Template(source=solution2,data=XML_from_data(data),title="test2").serialize()',
                   'from __main__ import solution2, data,XML_from_data;import kid').timeit(1)
print timeit.Timer('XML_from_data(data)','from __main__ import XML_from_data,data').timeit(1)
print timeit.Timer('kid.Template(source=solution3,title="test3").serialize()%dict(data=XML_from_data(data))',
                   'from __main__ import solution3,data,kid,XML_from_data').timeit(1)
-------------------------------------------------------------------------------</description>
		<content:encoded><![CDATA[<p>And if Kid is really so slow, why not generate the code server-side, but with a traditionnal for loop ?</p>
<p>I think that tools such as kid must not remove for our brain that there is still the &#8220;old way&#8221;.</p>
<p>I ran some tests, with a data set such as:</p>
<p>&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8211;<br />
NB_LINES = 1000<br />
a = &#8220;hello i&#8217;m a french guys&#8221;.split()<br />
data = [tuple(a) for i in range(NB_LINES)]<br />
&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8211;</p>
<p>I use that function to generate the  data:</p>
<p>&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8211;<br />
def XML_from_data(data):<br />
    out = &#8221;<br />
    for line in data:<br />
        out += &#8221;<br />
        for element in line:<br />
            out += &#8221; + element + &#8221;<br />
        out += &#8221;<br />
    return out<br />
&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;-</p>
<p>This function is really what we must not do if we want speed <img src='http://www.thesamet.com/blog/wp-includes/images/smilies/icon_smile.gif' alt=':)' class='wp-smiley' /> </p>
<p>The function take 0.00541855292977 in my hardware for one transformation of data.</p>
<p>I did 3 tests, one with full kid.<br />
The second with Kid which call XML on the output of XML_form_data<br />
the third one with just a replace() or string formating call on the output of kid and a placeholder for the table:</p>
<p>kid: 1.00006444319<br />
kid with XML(): 0.995648732246<br />
replace methode: 0.0171378728814</p>
<p>So if the XML() method is not interesting, the replace is. I don&#8217;t know if it&#8217;s difficult or not to use that solution on TG, but I think that can save you from the use of that JSON big and horrible hack <img src='http://www.thesamet.com/blog/wp-includes/images/smilies/icon_smile.gif' alt=':)' class='wp-smiley' /> </p>
<p>The code, note I love the *enlarge your textarea now* feature <img src='http://www.thesamet.com/blog/wp-includes/images/smilies/icon_smile.gif' alt=':)' class='wp-smiley' /> </p>
<p>&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8211;<br />
import kid<br />
import timeit</p>
<p>NB_LINES = 1000</p>
<p># data table<br />
a = &#8220;hello i&#8217;m a french guys&#8221;.split()<br />
data = [tuple(a) for i in range(NB_LINES)]</p>
<p>src = &#8220;&#8221;"</p>
<p>$title</p>
<p>%s</p>
<p>&#8220;&#8221;"</p>
<p>def XML_from_data(data):<br />
    #return &#8221; + &#8221;.join(&#8221;.join(line) for line in data) + &#8221;<br />
    out = &#8221;<br />
    for line in data:<br />
        out += &#8221;<br />
        for element in line:<br />
            out += &#8221; + element + &#8221;<br />
        out += &#8221;<br />
    return out</p>
<p>solution1 = src%&#8221;&#8217;$elem&#8221;&#8217;<br />
solution2 = src%&#8221;&#8217;${XML(data)}&#8221;&#8217;<br />
solution3 = src%&#8221;&#8217;%(data)s&#8221;&#8217;</p>
<p>print timeit.Timer(&#8217;kid.Template(source=solution1,data=data,title=&#8221;test1&#8243;).serialize()&#8217;,<br />
                   &#8216;from __main__ import solution1, data;import kid&#8217;).timeit(1)<br />
print timeit.Timer(&#8217;kid.Template(source=solution2,data=XML_from_data(data),title=&#8221;test2&#8243;).serialize()&#8217;,<br />
                   &#8216;from __main__ import solution2, data,XML_from_data;import kid&#8217;).timeit(1)<br />
print timeit.Timer(&#8217;XML_from_data(data)&#8217;,'from __main__ import XML_from_data,data&#8217;).timeit(1)<br />
print timeit.Timer(&#8217;kid.Template(source=solution3,title=&#8221;test3&#8243;).serialize()%dict(data=XML_from_data(data))&#8217;,<br />
                   &#8216;from __main__ import solution3,data,kid,XML_from_data&#8217;).timeit(1)<br />
&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;-</p>
]]></content:encoded>
	</item>
	<item>
		<title>By: thesamet</title>
		<link>http://www.thesamet.com/blog/2007/07/30/speeding-up-your-application-with-javascript-templates-and-cjson/#comment-6619</link>
		<dc:creator>thesamet</dc:creator>
		<pubDate>Mon, 30 Jul 2007 09:58:39 +0000</pubDate>
		<guid isPermaLink="false">http://www.thesamet.com/blog/2007/07/30/speeding-up-your-application-with-javascript-templates-and-cjson/#comment-6619</guid>
		<description>Good questions. In my case the relying on Javascript for rendering is acceptable. I can safely assume that my human clients have Javascript enabled, and web robots can not access this site anyway as it requires authentication. 

If necessary, one can overcome this limitation by detecting if the client supports javascript, and if not output the usual html template. I am not sure about how to make a single template for that, however.

As for CPU requirements on the client side - perhaps this can be an issue on certain configurations. As for my tests, the template processing time was unnoticable.

I think that the issue here is not that the data set is too large, but Kid is too slow. My tables are about 1000 rows and 5 columns, each containing numbers or short strings.

My system has cElementTree installed, so I guess Kid detects this. The measurements taken above do not take bandwidth into account, only data generation time on server. I haven't decided yet if I am willing to take the trade of gzipping the HTML output (bandwidth over server's cpu). Probably will have to conduct more experiments on that.</description>
		<content:encoded><![CDATA[<p>Good questions. In my case the relying on Javascript for rendering is acceptable. I can safely assume that my human clients have Javascript enabled, and web robots can not access this site anyway as it requires authentication. </p>
<p>If necessary, one can overcome this limitation by detecting if the client supports javascript, and if not output the usual html template. I am not sure about how to make a single template for that, however.</p>
<p>As for CPU requirements on the client side - perhaps this can be an issue on certain configurations. As for my tests, the template processing time was unnoticable.</p>
<p>I think that the issue here is not that the data set is too large, but Kid is too slow. My tables are about 1000 rows and 5 columns, each containing numbers or short strings.</p>
<p>My system has cElementTree installed, so I guess Kid detects this. The measurements taken above do not take bandwidth into account, only data generation time on server. I haven&#8217;t decided yet if I am willing to take the trade of gzipping the HTML output (bandwidth over server&#8217;s cpu). Probably will have to conduct more experiments on that.</p>
]]></content:encoded>
	</item>
	<item>
		<title>By: guillaum</title>
		<link>http://www.thesamet.com/blog/2007/07/30/speeding-up-your-application-with-javascript-templates-and-cjson/#comment-6618</link>
		<dc:creator>guillaum</dc:creator>
		<pubDate>Mon, 30 Jul 2007 09:11:19 +0000</pubDate>
		<guid isPermaLink="false">http://www.thesamet.com/blog/2007/07/30/speeding-up-your-application-with-javascript-templates-and-cjson/#comment-6618</guid>
		<description>If i well understood, your render your tables client-side and not server-side ?

But what if:

- your client have not javascript (such as web robot that are able to parse html table, but per haps not json syntax ?)
- your client have a small CPU. It seem that your measures is render time 'server-side'. But how much time it take 'client-side' ?

This seem normal that JSON take less time than kid on the server-side, the second one does processing server-side when the first does not.

Two last questions, do you try the cElementTree implementation of Kid and do you try to gzip your HTML output for minimizing the amount of needed bandwith.

At last, i'm really interested for an example of what you call "huge table".

(and sorry for my bad writing skill in your nice language)</description>
		<content:encoded><![CDATA[<p>If i well understood, your render your tables client-side and not server-side ?</p>
<p>But what if:</p>
<p>- your client have not javascript (such as web robot that are able to parse html table, but per haps not json syntax ?)<br />
- your client have a small CPU. It seem that your measures is render time &#8217;server-side&#8217;. But how much time it take &#8216;client-side&#8217; ?</p>
<p>This seem normal that JSON take less time than kid on the server-side, the second one does processing server-side when the first does not.</p>
<p>Two last questions, do you try the cElementTree implementation of Kid and do you try to gzip your HTML output for minimizing the amount of needed bandwith.</p>
<p>At last, i&#8217;m really interested for an example of what you call &#8220;huge table&#8221;.</p>
<p>(and sorry for my bad writing skill in your nice language)</p>
]]></content:encoded>
	</item>
</channel>
</rss>

<!-- Dynamic Page Served (once) in 0.306 seconds -->
