Created
March 27, 2009 18:56
-
-
Save miraglia/86824 to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> | |
| <html xmlns="http://www.w3.org/1999/xhtml"> | |
| <head> | |
| <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> | |
| <title>Profiling YUI DataTable with Profiler and ProfilerViewer: Simple Example</title> | |
| <!-- Combo-handled YUI CSS files: --> | |
| <link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/combo?2.7.0/build/datatable/assets/skins/sam/datatable.css&2.7.0/build/profilerviewer/assets/skins/sam/profilerviewer.css"> | |
| <!-- Combo-handled YUI JS files: --> | |
| <script type="text/javascript" src="http://yui.yahooapis.com/combo?2.7.0/build/yuiloader/yuiloader-min.js&2.7.0/build/dom/dom-min.js&2.7.0/build/event/event-min.js&2.7.0/build/dragdrop/dragdrop-min.js&2.7.0/build/element/element-min.js&2.7.0/build/datasource/datasource-min.js&2.7.0/build/datatable/datatable-min.js&2.7.0/build/profiler/profiler-min.js&2.7.0/build/profilerviewer/profilerviewer-min.js"></script> | |
| <script type="text/javascript" src="http://developer.yahoo.com/yui/examples/datatable/assets/js/data.js"></script> | |
| </head> | |
| <body class="yui-skin-sam"> | |
| <h1>Profiling YUI DataTable with Profiler and ProfilerViewer: Simple Example</h1> | |
| <p>Interact with the DataTable below, and when you're ready to see profiling data click the "view Profiler data" button at the top of the page. Note that ProfilerViewer's "refresh data" button cannot be used effectively in this example, because we're profiling all the DataTables on the page. Once you've rendered ProflerViewer the first time, its own DataTable instance is included in that profiling (as well as its usage of Dom, Event, etc.). In this case, use ProfilerViewer just to get a snapshot of profiling data at a single point in time.</p> | |
| <div id="basic"></div> | |
| <script type="text/javascript"> | |
| YAHOO.util.Event.onDOMReady(function() { | |
| YAHOO.example.Basic = function() { | |
| var myColumnDefs = [ | |
| {key:"id", sortable:true, resizeable:true}, | |
| {key:"date", formatter:YAHOO.widget.DataTable.formatDate, sortable:true, sortOptions:{defaultDir:YAHOO.widget.DataTable.CLASS_DESC},resizeable:true}, | |
| {key:"quantity", formatter:YAHOO.widget.DataTable.formatNumber, sortable:true, resizeable:true}, | |
| {key:"amount", formatter:YAHOO.widget.DataTable.formatCurrency, sortable:true, resizeable:true}, | |
| {key:"title", sortable:true, resizeable:true} | |
| ]; | |
| var myDataSource = new YAHOO.util.DataSource(YAHOO.example.Data.bookorders); | |
| myDataSource.responseType = YAHOO.util.DataSource.TYPE_JSARRAY; | |
| myDataSource.responseSchema = { | |
| fields: ["id","date","quantity","amount","title"] | |
| }; | |
| var myDataTable = new YAHOO.widget.DataTable("basic", | |
| myColumnDefs, myDataSource, {caption:"DataTable Caption"}); | |
| return { | |
| oDS: myDataSource, | |
| oDT: myDataTable | |
| }; | |
| }(); | |
| //Create your ProfilerViewer instance: | |
| var pv = new YAHOO.widget.ProfilerViewer(null, { | |
| visible: false, | |
| tableHeight: "300px", | |
| showChart: true, | |
| filter: function(o) { | |
| return (o.calls > 0); | |
| }, | |
| swfUrl:"http://yui.yahooapis.com/2.7.0/build/charts/assets/charts.swf", | |
| maxChartFunctions:10 | |
| }); | |
| //For a simple DataTable, here are some of the interesting | |
| //objects and functions you might want to measure | |
| YAHOO.tool.Profiler.registerObject("YAHOO.util.Dom", true); | |
| YAHOO.tool.Profiler.registerObject("YAHOO.util.Event", true); | |
| YAHOO.tool.Profiler.registerConstructor("YAHOO.widget.DataTable"); | |
| YAHOO.tool.Profiler.registerConstructor("YAHOO.util.DataSource"); | |
| YAHOO.tool.Profiler.registerConstructor("YAHOO.widget.Column"); | |
| YAHOO.tool.Profiler.registerConstructor("YAHOO.widget.ColumnDD"); | |
| YAHOO.tool.Profiler.registerConstructor("YAHOO.widget.ColumnResizer"); | |
| YAHOO.tool.Profiler.registerConstructor("YAHOO.widget.Record"); | |
| YAHOO.tool.Profiler.registerConstructor("YAHOO.widget.RecordSet"); | |
| YAHOO.tool.Profiler.registerFunction("YAHOO.util.Sort.compare"); | |
| }); | |
| </script> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment