bower install
ruby store.rb
To reproduce in Chrome or Firefox, navigate to http://localhost:4567. Then, Quickly scroll the grid. Make sure you have the console open to see the error.
Created
June 26, 2012 05:37
-
-
Save nicknisi/2993553 to your computer and use it in GitHub Desktop.
A simple web server to test the dgrid scrolling bug
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
| components/ |
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
| { | |
| "name": "dgrid-bug", | |
| "version": "0.0.0", | |
| "ignore": [ | |
| "**/.*", | |
| "node_modules", | |
| "components" | |
| ], | |
| "dependencies": { | |
| "dojo": "~1.9.0", | |
| "dijit": "~1.9.0", | |
| "xstyle": "~0.1.3", | |
| "put-selector": "~0.3.4", | |
| "dgrid": "https://github.com/SitePen/dgrid.git" | |
| } | |
| } |
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 HTML 4.01 Transitional//EN" | |
| "http://www.w3.org/TR/html4/loose.dtd"> | |
| <html> | |
| <head> | |
| <title>Test Performance</title> | |
| <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> | |
| <meta name="viewport" content="width=570" /> | |
| <style type="text/css"> | |
| @import "dojo/resources/dojo.css"; | |
| @import "dgrid/css/dgrid.css"; | |
| @import "dgrid/css/skins/tundra.css"; | |
| .heading { | |
| font-weight: bold; | |
| margin-left: 12px; | |
| padding-bottom: 0.25em; | |
| } | |
| .ui-widget{ | |
| margin: 10px; | |
| } | |
| /* this is not part of theme, but you can add odd-even coloring this way*/ | |
| .dgrid-row-odd { | |
| background: #F2F5F9; | |
| } | |
| #grid { | |
| width: 68em; | |
| height: 50em; | |
| padding: 1px; | |
| } | |
| </style> | |
| <script> | |
| var dojoConfig = { | |
| async: true | |
| }; | |
| </script> | |
| <script type="text/javascript" src="dojo/dojo.js"></script> | |
| <script type="text/javascript"> | |
| require(["dgrid/List", "dgrid/OnDemandGrid","dgrid/Selection", "dgrid/Keyboard", "dojo/_base/declare", "dgrid/test/data/perf", "dojo/store/JsonRest", "dgrid/editor", "dijit/form/CheckBox", "dojo/domReady!"], | |
| function(List, Grid, Selection, Keyboard, declare, testPerfStore, JsonRestStore, editor, CheckBox){ | |
| var store = new JsonRestStore({ | |
| target : 'http://localhost:4567/data', | |
| idAttribtue : 'id' | |
| }); | |
| var columns = [ | |
| editor({ | |
| editor : CheckBox, | |
| editorArgs : { value : true }, | |
| autoSave : true, | |
| label : 'Included?', | |
| field : 'checkbox', | |
| sortable : false, | |
| editable : true | |
| }), | |
| { name: 'Column 0', field: 'id', width: '10%' }, | |
| { name: 'Column 1', field: 'integer', width: '10%' }, | |
| { name: 'Column 2', field: 'floatNum', width: '10%' }, | |
| { name: 'Column 3', field: 'date', width: '10%' }, | |
| { name: 'Column 4', field: 'date2', width: '10%' }, | |
| { name: 'Column 5', field: 'text', width: '10%' }, | |
| { name: 'Column 6', field: 'bool', width: '10%' }, | |
| { name: 'Column 7', field: 'bool2', width: '10%' }, | |
| { name: 'Column 8', field: 'price', width: '10%' }, | |
| { name: 'Column 9', field: 'today', width: '10%' } | |
| ]; | |
| var start = new Date().getTime(); | |
| window.grid = new (declare([Grid, Selection, Keyboard]))({ | |
| store: store, | |
| columns: columns | |
| }, "grid"); | |
| console.log("startup time", new Date().getTime() - start); | |
| var processScroll = grid._processScroll; | |
| grid._processScroll = function(){ | |
| var start = new Date().getTime(); | |
| processScroll.call(this); | |
| console.log("scroll time", new Date().getTime() - start); | |
| }; | |
| }); | |
| </script> | |
| </head> | |
| <body class="tundra"> | |
| <h2 class="heading">A performance test designed to go head to head with DataGrid's test_datagrid_performance.html</h2> | |
| <div id="grid"></div> | |
| </body> | |
| </html> |
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
| require 'json' | |
| require 'sinatra' | |
| set :public_folder, Proc.new { File.join(root, "components") } | |
| data = [] | |
| NUM_RECORDS = 20000 | |
| (1..NUM_RECORDS).each do |i| | |
| data.push( | |
| :checkbox => Random.rand(1..100) > 50, | |
| :id => i, | |
| :integer => Random.rand(1..100), | |
| :floatNum => Random.rand(1..100), | |
| :date => Date.new, | |
| :date2 => Date.new, | |
| :text => "A number in text #{Random.rand(1..i)}", | |
| :bool => Random.rand(1..100) > 50, | |
| :bools => Random.rand(1..100) > 50, | |
| :price => Random.rand(1..100) * 0.5, | |
| :today => Date.new | |
| ) | |
| end | |
| get '/' do | |
| File.read('performance.html') | |
| end | |
| get '/data' do | |
| content_type 'application/json' | |
| first, last = request.env['HTTP_RANGE'].split('=')[1].split('-').map { |val| val.to_i } | |
| # convert to ints | |
| first = first.to_i | |
| last = last.to_i | |
| count = last - first | |
| payload = data[first..last] | |
| response['Content-Range'] = "items #{first}-#{last}/#{NUM_RECORDS}" | |
| body { payload.to_json } | |
| end |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment