Upgrade to ExtJS 3.0.0 - Released 07/06/2009

[extjs.git] / examples / grid / buffer.html
diff --git a/examples/grid/buffer.html b/examples/grid/buffer.html

new file mode 100644 (file)

index 0000000..aeb8b52
--- /dev/null
+++ b/examples/grid/buffer.html
@@ -0,0 +1,52 @@
+<html>\r
+<head>\r
+       <title>Buffer Grid Example</title>\r
+       <link rel="stylesheet" type="text/css" href="../../resources/css/ext-all.css" />\r
+       <!-- GC -->\r
+       <!-- LIBS -->\r
+       <script type="text/javascript" src="../../adapter/ext/ext-base.js"></script>\r
+       <!-- ENDLIBS -->\r
+\r
+       <script type="text/javascript" src="../../ext-all.js"></script>\r
+\r
+       <script type="text/javascript" src="../ux/BufferView.js"></script>\r
+       <script type="text/javascript" src="buffer.js"></script>\r
+       <link rel="stylesheet" type="text/css" href="grid-examples.css" />\r
+       \r
+       <!-- Common Styles for the examples -->\r
+       <link rel="stylesheet" type="text/css" href="../shared/examples.css" />\r
+       <style type="text/css">\r
+       .x-grid3-td-topic b {\r
+           font-family:tahoma, verdana;\r
+           display:block;\r
+               overflow:hidden;\r
+               width:98%;\r
+               text-overflow:ellipsis;\r
+       }\r
+       .x-grid3-td-topic b i {\r
+           font-weight:normal;\r
+           font-style: normal;\r
+           color:#000;\r
+               overflow:hidden;\r
+               text-overflow:ellipsis;\r
+       }\r
+       .x-grid3-td-topic .x-grid3-cell-inner {\r
+           white-space: nowrap;\r
+       }\r
+       </style>\r
+</head>\r
+<body>\r
+<script type="text/javascript" src="../shared/examples.js"></script><!-- EXAMPLES -->\r
+<h1>Buffer Grid Example</h1>\r
+<p>This example customizes the grid view to do bufferred rendering of the cells of just the visible rows in the grid. \r
+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
+can also help to improve the overall performance of your Ext application.<br/><br/>\r
+<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
+<p>To use this example, be sure to add the following JS file:  <a href="BufferView.js">BufferView.js</a></p>\r
+<p>This grid uses a ScriptTagProxy to fetch cross-domain remote data (from the Ext forums).</p>\r
+<p>Note that the js is not minified so it is readable. See <a href="buffer.js">buffer.js</a>.</p>\r
+\r
+<div id="topic-grid"></div>\r
+\r
+</body>\r
+</html>\r