Upgrade to ExtJS 3.0.0 - Released 07/06/2009
[extjs.git] / examples / grid / buffer.html
1 <html>\r
2 <head>\r
3         <title>Buffer Grid Example</title>\r
4         <link rel="stylesheet" type="text/css" href="../../resources/css/ext-all.css" />\r
5         <!-- GC -->\r
6         <!-- LIBS -->\r
7         <script type="text/javascript" src="../../adapter/ext/ext-base.js"></script>\r
8         <!-- ENDLIBS -->\r
9 \r
10         <script type="text/javascript" src="../../ext-all.js"></script>\r
11 \r
12         <script type="text/javascript" src="../ux/BufferView.js"></script>\r
13         <script type="text/javascript" src="buffer.js"></script>\r
14         <link rel="stylesheet" type="text/css" href="grid-examples.css" />\r
15         \r
16         <!-- Common Styles for the examples -->\r
17         <link rel="stylesheet" type="text/css" href="../shared/examples.css" />\r
18         <style type="text/css">\r
19         .x-grid3-td-topic b {\r
20             font-family:tahoma, verdana;\r
21             display:block;\r
22                 overflow:hidden;\r
23                 width:98%;\r
24                 text-overflow:ellipsis;\r
25         }\r
26         .x-grid3-td-topic b i {\r
27             font-weight:normal;\r
28             font-style: normal;\r
29             color:#000;\r
30                 overflow:hidden;\r
31                 text-overflow:ellipsis;\r
32         }\r
33         .x-grid3-td-topic .x-grid3-cell-inner {\r
34             white-space: nowrap;\r
35         }\r
36         </style>\r
37 </head>\r
38 <body>\r
39 <script type="text/javascript" src="../shared/examples.js"></script><!-- EXAMPLES -->\r
40 <h1>Buffer Grid Example</h1>\r
41 <p>This example customizes the grid view to do bufferred rendering of the cells of just the visible rows in the grid. \r
42 This results in a much smaller DOM structure and substantially improves performance of resizing, forceFit, autoExpandColumn and other layout and DOM manipulation features in a large grid. The smaller DOM structure \r
43 can also help to improve the overall performance of your Ext application.<br/><br/>\r
44 <b>While this example works perfectly, this is completely experimental and only a subset of standard grid features are available. It might need slight customizing for your application needs.</b></p>\r
45 <p>To use this example, be sure to add the following JS file:   <a href="BufferView.js">BufferView.js</a></p>\r
46 <p>This grid uses a ScriptTagProxy to fetch cross-domain remote data (from the Ext forums).</p>\r
47 <p>Note that the js is not minified so it is readable. See <a href="buffer.js">buffer.js</a>.</p>\r
48 \r
49 <div id="topic-grid"></div>\r
50 \r
51 </body>\r
52 </html>\r