latest
[booh] / www / advanced.html
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2 <html xmlns="http://www.w3.org/1999/xhtml">
3
4 <head>
5   <title>Booh - The Web-Album of choice for discriminating Linux users</title>
6   <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
7   <meta name="viewport" content="width=device-width"/>  
8 <style type="text/css">
9 body {
10         font-family: Verdana, Arial, Helvetica, sans-serif, monospace;
11         text-align: justify;
12 }
13 pre { background-color: #e0e0e0; }
14 tt { background-color: #e0e0e0; }
15 @media all and (orientation: landscape) {  
16     body {
17         margin-left: 15%;
18         margin-right: 15%;
19     }
20 }
21 </style>
22 </head>
23
24 <body bgcolor="#FFFFFF" text="#000000" link="#0000ee" vlink="#551a8b">
25
26    <table width="100%" cellspacing="0" cellpadding="0">
27      <tr>
28        <td width="25%" align="left" valign="top">
29          <a class="FlattrButton" style="display:none;" rev="flattr;button:compact;" href="http://booh.org/"></a>
30        </td>
31        <td width="50%" align="center">
32          <img src="images/logo.png" alt="booh logo"/>
33        </td>
34        <td width="25%" align="right" valign="top">
35          <div style="display:inline-block; margin-bottom:0.2em"><img src="images/en.png" alt="this page is in english"/></div>
36          <div style="display:inline-block"><a href="advanced.fr.html"><img src="images/fr.png" alt="cette page en fran├žais"/></a></div>
37        </td>
38      </tr>
39    </table>
40
41    <h1 align="center">Booh</h1>
42
43    <p align="center">[ <a href="index.html">home</a> |
44                        <a href="themes/gradient/">example web-album</a> |
45                        <a href="video-demo.html">video demo</a> |
46                        <a href="tutorial.html">tutorial</a> |
47                        advanced |
48                        <a href="discuss.html">discuss</a> |
49                        <a href="download.html">download</a> ]</p>
50
51    <a name="performance"><h2>Performance - web-album creation</h2></a>
52
53    <p>To improve performance when creating thumbnails - a long and
54    painful step when creating web-albums - Booh takes advantage of
55    multi-processor machines.</p>
56
57    <p>The following figures were obtained on a P4 HT 2.8 GHz with
58    Linux 2.6.6 SMP 4G (note that this is not a real SMP machine) with
59    the same bunch of thumbnails to create:</p>
60
61 <pre>
62     Regular    2:10.81 elapsed
63     --mproc 2  2:01.44 elapsed  (0.928 Regular)
64 </pre>
65
66    <p>This is not bad, but clearly shows that an hyperthreading
67    P4 is not a real SMP machine by far! Now let's try with a
68    6-CPUs Pentium-3 Cascades 700 MHz:</p>
69
70 <pre>
71     Regular    2:58.07 elapsed
72     --mproc 2  1:32.48 elapsed
73     --mproc 3  1:03.34 elapsed
74     --mproc 4  0:49.12 elapsed
75     --mproc 5  0:40.86 elapsed
76     --mproc 6  0:39.03 elapsed  (0.219 Regular)
77 </pre>
78
79    <p>Now this multi-processor support Booh has is not a toy
80    feature.</p>
81
82    <p>More recent tests (not the same photos), on a Core i5
83    650 (dual core HT) 3.2 GHz with Linux 2.6.33.7 x86_64:</p>
84
85 <pre>
86     Regular    0:48.79 elapsed
87     --mproc 2  0:27.87 elapsed
88     --mproc 3  0:20.38 elapsed
89     --mproc 4  0:16.96 elapsed  (0.347 Regular)
90 </pre>
91
92    <p>More recent tests (not the same photos), on a Core i7
93    3770 (quad core HT) 3.4 GHz with Linux 3.3.4 x86_64:</p>
94
95 <pre>
96     Regular    1:18.21 elapsed
97     --mproc 2  0:39.82 elapsed
98     --mproc 3  0:27.49 elapsed
99     --mproc 4  0:20.95 elapsed
100     --mproc 5  0:17.88 elapsed
101     --mproc 6  0:15.77 elapsed
102     --mproc 7  0:13.93 elapsed
103     --mproc 8  0:12.70 elapsed  (0.162 Regular)
104     --mproc 9  0:12.66 elapsed
105 </pre>
106
107    <p>More recent tests (not the same photos), on a Core i7 7700T (quad core HT) 2.9 GHz (cpuinfo says it goes up to 3700 MHz) with Linux 4.13.3:</p>
108
109 <pre>
110     Regular    0:39.49 elapsed
111     --mproc 2  0:24.30 elapsed
112     --mproc 3  0:19.48 elapsed
113     --mproc 4  0:18.88 elapsed
114     --mproc 5  0:17.49 elapsed
115     --mproc 6  0:17.11 elapsed
116     --mproc 7  0:17.05 elapsed
117     --mproc 8  0:18.67 elapsed  
118  </pre>
119
120    <a name="classifierperformance"><h2>Performance - <i>booh-classifier</i></h2></a>
121
122    <p>
123      A test has been conducted on a p4 2.8 GHz with 1G of memory
124      running GTK+ 2.12.9: loading 134 3456x2304 photos coming
125      from a Canon EOS 350D, worth a total of 396 MB. After all
126      the files are in the file system's cache, the time to show
127      a thumbnail for all the photos is measured with
128      <i>booh-classifier</i> against other widely used programs:
129    </p>
130
131    <ul>
132      <li>booh-classifier 0.9.0: 18.9 seconds</li>
133      <li><a href="http://gthumb.sourceforge.net/">gthumb</a> 2.10.8: 22.5 seconds</li>
134      <li><a href="http://www.gnome.org/projects/eog/">eog</a> 2.22.0: 28 seconds</li>
135      <li><a href="http://www.konqueror.org/">konqueror</a> 3.5.9: 1
136      minute and 40 seconds (konqueror is apparently very slow for that
137      large photos, while it's reasonably fast for smaller photos)</li>
138    </ul>
139
140    <p>
141      Notice that also, gthumb and eog don't preload neighbourghood
142      photos (konqueror neither, but that's not applicable anyway); eog
143      is not capable of showing videos; and konqueror don't even show
144      portrait photos (containing the proper EXIF orientation)
145      correctly rotated - though I suspect it might be related to
146      something with the compilation or the configuration which I
147      wasn't able to locate.
148    </p>
149
150
151
152
153    <h2>Disk usage</h2>
154
155    <p>To reduce disk space usage, web-albums including the original
156    images use hard links between the original image in the source
157    directory and the destination directory. Of course, this requires
158    you use a single disk and partition for the source and destination
159    directories; if this is not the case, the image is simply copied
160    (that's fully transparent to the end-user).</p>
161
162
163
164
165    <h2>Architecture and data processing</h2>
166
167    <p>
168      The web-album generating is fully done by a CLI program called
169      <tt>booh-backend</tt>. It generates and/or manipulates an XML
170      file. Editing is done by a graphical front-end (using GTK+) called
171      <tt>booh</tt>. Therefore, one can generate a web-album with no
172      editing (and actually no human input)
173      <a href="tutorial.html#fastest">only with the CLI program</a> if
174      necessary, or opposedly, only use the graphical program if so
175      enclined (which is the easiest and recommended way). The use of
176      the XML file in between allows for easy "scripting" or
177      "extension" with any XML processing tool if needed. The XML file
178      has a straightforward DTD and actually comprises a tree of
179      elements similar to the filesystem tree of the web-album.
180    </p>
181
182
183
184    <h2>Internals</h2>
185
186    <p>The web-album generated by Booh makes heavy use of javascript in
187    order to be able to perform clever preloading of next/previous
188    images, and to show all images within a single HTML page (saves a
189    download and prevent from changing your scrolling position in the
190    browser). It should work fine with the broken insecure dominant
191    web-browser, but it has been developed using Galeon. Also, notice
192    that the generated album is perfectly viewable without javascript
193    (specific HTML pages are generated for that matter), hence
194    javascript is not mandatory to browse the albums (a browser with
195    javascript disabled will still be able to browse the albums).</p>
196
197    <p>The default theme, 'simple', has been written to be simple,
198    slick and could probably look better (submissions welcome). It has
199    several sizes of thumbnails and fullscreens, carefully crafted to
200    fit the most out of 800x600, 1024x748, 1280x1024, 1400x1050 and
201    1600x1200 displays (you can select the list of sizes you want for
202    your web-albums - then, when users browse the albums, a javascript
203    autodetection of the best size to fit the actual browser window
204    size is used). People interested in HTML/CSS are welcome to submit
205    new themes - check out the file THEMES in the tarball for
206    documentation about it.</p>
207
208    <p>If you want to create a new theme, or make local modifications
209    to a theme, just have them in your <tt>~/.booh-themes</tt>
210    directory (Booh version 0.9.2 and more recent). For example, to
211    hack off 'dark':
212    </p>
213
214 <pre>
215 # mkdir ~/.booh-themes
216 # cp -a /usr/share/booh/themes/dark ~/.booh-themes/mine
217 </pre>
218
219    <p>Use a different name than original theme names (here I picked
220    the dummy name 'mine', choose a better one).</p>
221
222    <p>
223      Currently available themes: <a href="http://booh.org/themes/simple/">simple</a> -
224                      <a href="http://booh.org/themes/gradient/">gradient</a> -
225                      <a href="http://booh.org/themes/cardu/">cardu</a> -
226                      <a href="http://booh.org/themes/dark/">dark</a> -
227                      <a href="http://booh.org/themes/sbs/">sbs</a>.
228    </p>
229
230
231
232
233    <h2>Translations</h2>
234
235    <p>
236      Booh has full internationalization support. Additionally, Booh
237      can generate web-albums with multi-languages navigation, so
238      that the web-albums automatically adapt to the language of the
239      user who's browsing! If missing, please contribute a
240      translation to your native language! Check the directory 'po'
241      in the download archive.
242    </p>
243
244    <table cellspacing="0" cellpadding="0">
245    <tr>
246      <td>
247        Booh is already available in french, german, japanese and
248        esperanto (beside english, of course).
249      </td>
250      <td align="right" width="1%">
251        <nobr>
252          <img src="images/en.png" alt="english flag"/>
253          <img src="images/fr.png" alt="french flag"/>
254          <img src="images/de.png" alt="german flag"/>
255          <img src="images/ja.png" alt="japanese flag"/>
256          <img src="images/eo.png" alt="esperanto flag"/>
257        </nobr>
258      </td>
259    </tr>
260    </table>
261
262
263 <p align="right"><font size="-1">Wed Jun  1 17:53:58 2011</font></p>
264
265 </body>
266
267 </html>