comp.lang.javascript Cookbook Proposal

Giganews Newsgroups
Subject: comp.lang.javascript Cookbook Proposal
Posted by:  Peter Michaux (petermicha…
Date: Thu, 01 Nov 2007

There has been plenty of "friendly chat" about JavaScript libraries
here lately. The readily available libraries are not satisfactory in
many peoples opinion though. It is also clear code reuse is desirable
with some form of a library or code repository. It is clear to me
that, overall, the regulars at comp.lang.javascript have more
experience and technical knowledge about fundamental browser scripting
issues than other online groups. Can we harness that knowledge?

I don't think the comp.lang.javascript contributors will agree on any
large scale structure for a JavaScript library. Perhaps we can compile
a cookbook of examples that is along the lines of some of the FAQ and
FAQ notes but inclusive for less frequent topics. Perhaps this would
be a way to revitalize the FAQ and FAQ notes. This would allow
multiple implementations of a particular solution to be included in
the cookbook with recommendations for when/how each particular
solution should be used. There are some low level tasks that could
easily fall into this cookbook. Examples would include element
position reporting and form serialization, etc. This may also be more
fun and productive to compile than to have the "friendly chats" about
other libraries.

I think the added documentation notes about when a solution is
applicable may allow the interesting social dynamics of the group to
have success since there will be no single right answer. Also by
stating in which browsers a particular solution works will make the
examples somewhat durable over time as a resource. This would also be
more that the group could point to and say "this is a good JavaScript
resource." Rather than always having so little to recommend.

I think there would need to be a standardized format for the cookbook.
Which browsers the solution supports. What happens in other browsers.
How to detect when the solution is supported in a particular browser.
On which other solutions in the cookbook does the solution depend. It
would be nice if the format is parsable so that if someone wanted to
build a library with a particular API it could be done automatically
with a build system. That build system would be up to individuals to
build and out of scope of the cookbook.

I'll venture that at least some other people find this idea intriguing
and would participate. I think a group project would be good for
c.l.js and perhaps this would be a good one that would not take
extraordinary brainpower or time commitment. I think a good cookbook
of low level functions could be assembled quite quickly by the group.

Here is a stab at what information might be included for our favorite
example of trimming whitespace from the FAQ. XML might be nicer/more
compact for this task but HTML allows easy posting to the web. Please
note I didn't really check which browsers support which solution
below. This is just an example to get the ball rolling on how to
format a solution.

<div class="problem" id="problem_1">

  <p class="statement">
    remove whitespace from the beginning and end of a string

    <div class="solution" id="solution_1_1">

      <ul class="browsers">

      <div class="notes">
            In browsers that do not support regular expression literal
            this code will cause a syntax error. The entire script element
containing this
            trim function will not be evaluated and so the trim function
will not
            be available. If your set of target browsers is outside the set
of browsers
            supported this recipe you should test for the existence of the
            function before calling it. For example,

        <code class="use">
          if (trim) {
            str = trim(str);

            function trim(str) {
              return str.replace(/^\s+|\s+$/g, '');

    <div class="solution" id="solution_1_2">

    <!-- supported browsers inherited from dependencies -->

    <div class="notes">
      <p>See notes of dependencies.</p>

    <ul class="dependencies">
      <li><a href="#solution_2_2">solution_2_2</a></li> <!-- lTrim -->
      <li><a href="#solution_3_2">solution_3_2</a></li> <!-- rTrim -->

      function trim(str) {
        return lTrim(rTrim(str));


This is starting to have the feel of a database. Perhaps a different
storage format would be more appropriate. An HTML form could be
created to make generating one of these solution blocks easier.

What do you think?