{"action":"created","issue":{"url":"https://api.github.com/repos/facebook/fixed-data-table/issues/263","repository_url":"https://api.github.com/repos/facebook/fixed-data-table","labels_url":"https://api.github.com/repos/facebook/fixed-data-table/issues/263/labels{/name}","comments_url":"https://api.github.com/repos/facebook/fixed-data-table/issues/263/comments","events_url":"https://api.github.com/repos/facebook/fixed-data-table/issues/263/events","html_url":"https://github.com/facebook/fixed-data-table/issues/263","id":104777753,"number":263,"title":"Inefficient DOM structure (unnecessary nested markup)","user":{"login":"bvaughn","id":29597,"avatar_url":"https://avatars.githubusercontent.com/u/29597?v=3","gravatar_id":"","url":"https://api.github.com/users/bvaughn","html_url":"https://github.com/bvaughn","followers_url":"https://api.github.com/users/bvaughn/followers","following_url":"https://api.github.com/users/bvaughn/following{/other_user}","gists_url":"https://api.github.com/users/bvaughn/gists{/gist_id}","starred_url":"https://api.github.com/users/bvaughn/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/bvaughn/subscriptions","organizations_url":"https://api.github.com/users/bvaughn/orgs","repos_url":"https://api.github.com/users/bvaughn/repos","events_url":"https://api.github.com/users/bvaughn/events{/privacy}","received_events_url":"https://api.github.com/users/bvaughn/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"milestone":null,"comments":4,"created_at":"2015-09-03T20:43:05Z","updated_at":"2016-05-11T09:46:56Z","closed_at":null,"body":"Hi guys. Thanks for creating and maintaining this library. :)\r\n\r\nI'm working on a project that uses it. I recent took a look at the markup generated this component and it does not seem very optimized. Each \"cell\" in the \"table\" (what would be a `<td>` in a regular HTML `<table>`) actually consists of many nested nodes:\r\n\r\n```html\r\n<!-- display: inline-block -->\r\n<div class=\"fixedDataTableCellLayout_main public_fixedDataTableCell_main\">\r\n  <!-- display: table -->\r\n  <div class=\"fixedDataTableCellLayout_wrap1 public_fixedDataTableCell_wrap1\">\r\n    <!-- display: table-row -->\r\n    <div class=\"fixedDataTableCellLayout_wrap2 public_fixedDataTableCell_wrap2\">\r\n      <!-- display: table-cell -->\r\n      <div class=\"fixedDataTableCellLayout_wrap3 public_fixedDataTableCell_wrap3\">\r\n        <!-- display: block -->\r\n        <div class=\"public_fixedDataTableCell_cellContent\">\r\n          <!-- Cell content -->\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</div>\r\n```\r\n\r\nI understand that plain HTML `<table>` doesn't work well for the fixed header interface this library is offering. But why is this nested structure required for each cell? So far as I know, nesting a table inside of an inline-block element doesn't do anything more than just using the inline-block element directly.\r\n\r\nWhy could the above markup not be simplified to:\r\n```html\r\n<!-- display: inline-block -->\r\n<div class=\"fixedDataTableCellLayout_main public_fixedDataTableCell_main\">\r\n  <!-- display: block -->\r\n  <div class=\"public_fixedDataTableCell_cellContent\">\r\n    <!-- Cell content -->\r\n  </div>\r\n</div>\r\n```\r\n\r\nFor that matter, is the inner cell-content wrapper even necessary? Why not just:\r\n```html\r\n<!-- display: inline-block -->\r\n<div class=\"fixedDataTableCellLayout_main public_fixedDataTableCell_main\">\r\n  <!-- Cell content -->\r\n</div>\r\n```\r\n\r\nAt the point where you're managing widths and row-heights to make things appear like a classical HTML table, I don't see what the `display: table` rules buy you. Any chance you could collapse some of these nodes and lighten the DOM load on the browser?"},"comment":{"url":"https://api.github.com/repos/facebook/fixed-data-table/issues/comments/218412371","html_url":"https://github.com/facebook/fixed-data-table/issues/263#issuecomment-218412371","issue_url":"https://api.github.com/repos/facebook/fixed-data-table/issues/263","id":218412371,"user":{"login":"jamesseanwright","id":2032803,"avatar_url":"https://avatars.githubusercontent.com/u/2032803?v=3","gravatar_id":"","url":"https://api.github.com/users/jamesseanwright","html_url":"https://github.com/jamesseanwright","followers_url":"https://api.github.com/users/jamesseanwright/followers","following_url":"https://api.github.com/users/jamesseanwright/following{/other_user}","gists_url":"https://api.github.com/users/jamesseanwright/gists{/gist_id}","starred_url":"https://api.github.com/users/jamesseanwright/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/jamesseanwright/subscriptions","organizations_url":"https://api.github.com/users/jamesseanwright/orgs","repos_url":"https://api.github.com/users/jamesseanwright/repos","events_url":"https://api.github.com/users/jamesseanwright/events{/privacy}","received_events_url":"https://api.github.com/users/jamesseanwright/received_events","type":"User","site_admin":false},"created_at":"2016-05-11T09:46:55Z","updated_at":"2016-05-11T09:46:55Z","body":"To dig this up from last year, I definitely would not use this unless you moved to `table` elements over `div`s. `table` is semantic, whereas `div` isn't. Are there any plans to do this? "}}