{"action":"created","issue":{"url":"https://api.github.com/repos/react-bootstrap/react-bootstrap/issues/867","labels_url":"https://api.github.com/repos/react-bootstrap/react-bootstrap/issues/867/labels{/name}","comments_url":"https://api.github.com/repos/react-bootstrap/react-bootstrap/issues/867/comments","events_url":"https://api.github.com/repos/react-bootstrap/react-bootstrap/issues/867/events","html_url":"https://github.com/react-bootstrap/react-bootstrap/pull/867","id":89785821,"number":867,"title":"[fixed] Create overlay target only when needed.","user":{"login":"amarant","id":2281471,"avatar_url":"https://avatars.githubusercontent.com/u/2281471?v=3","gravatar_id":"","url":"https://api.github.com/users/amarant","html_url":"https://github.com/amarant","followers_url":"https://api.github.com/users/amarant/followers","following_url":"https://api.github.com/users/amarant/following{/other_user}","gists_url":"https://api.github.com/users/amarant/gists{/gist_id}","starred_url":"https://api.github.com/users/amarant/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/amarant/subscriptions","organizations_url":"https://api.github.com/users/amarant/orgs","repos_url":"https://api.github.com/users/amarant/repos","events_url":"https://api.github.com/users/amarant/events{/privacy}","received_events_url":"https://api.github.com/users/amarant/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"milestone":null,"comments":4,"created_at":"2015-06-20T15:55:38Z","updated_at":"2015-06-20T16:52:34Z","closed_at":null,"pull_request":{"url":"https://api.github.com/repos/react-bootstrap/react-bootstrap/pulls/867","html_url":"https://github.com/react-bootstrap/react-bootstrap/pull/867","diff_url":"https://github.com/react-bootstrap/react-bootstrap/pull/867.diff","patch_url":"https://github.com/react-bootstrap/react-bootstrap/pull/867.patch"},"body":"Currently react-bootstrap creates an empty div for every tooltip or popover, in an application that has many tooltips it slows down the rendering a lot and mess with the react dev tools; this aims to only create an empty div, the portal endpoint, when needed like the original jquery bootstrap. It also refers to the issue #353 that was closed without a solution.\r\nThanks for looking at it."},"comment":{"url":"https://api.github.com/repos/react-bootstrap/react-bootstrap/issues/comments/113789582","html_url":"https://github.com/react-bootstrap/react-bootstrap/pull/867#issuecomment-113789582","issue_url":"https://api.github.com/repos/react-bootstrap/react-bootstrap/issues/867","id":113789582,"user":{"login":"amarant","id":2281471,"avatar_url":"https://avatars.githubusercontent.com/u/2281471?v=3","gravatar_id":"","url":"https://api.github.com/users/amarant","html_url":"https://github.com/amarant","followers_url":"https://api.github.com/users/amarant/followers","following_url":"https://api.github.com/users/amarant/following{/other_user}","gists_url":"https://api.github.com/users/amarant/gists{/gist_id}","starred_url":"https://api.github.com/users/amarant/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/amarant/subscriptions","organizations_url":"https://api.github.com/users/amarant/orgs","repos_url":"https://api.github.com/users/amarant/repos","events_url":"https://api.github.com/users/amarant/events{/privacy}","received_events_url":"https://api.github.com/users/amarant/received_events","type":"User","site_admin":false},"created_at":"2015-06-20T16:52:34Z","updated_at":"2015-06-20T16:52:34Z","body":"Creating the divs at the beginning in my application end up doing \r\n```javascript\r\nthis._overlayTarget = document.createElement('div')\r\nthis.getContainerDOMNode().appendChild(this._overlayTarget)\r\n````\r\ntimes the total number of OverlayMixed component, at the initial rendering. So maybe 200 single div creation and appending.\r\nThere is generally at most 1 tooltip viewed at a time, and not every tooltip ends up being viewed in the lifetime of the application, I really don't understand what number are needed. Also note that viewing a tooltip ends up creating other span or div so I don't see the problem."}}