{"action":"opened","issue":{"url":"https://api.github.com/repos/emberjs/rfcs/issues/157","repository_url":"https://api.github.com/repos/emberjs/rfcs","labels_url":"https://api.github.com/repos/emberjs/rfcs/issues/157/labels{/name}","comments_url":"https://api.github.com/repos/emberjs/rfcs/issues/157/comments","events_url":"https://api.github.com/repos/emberjs/rfcs/issues/157/events","html_url":"https://github.com/emberjs/rfcs/issues/157","id":167036041,"number":157,"title":"Reduce application file size by introducing wrappers for JS Document/Element functions","user":{"login":"samcic","id":9308871,"avatar_url":"https://avatars.githubusercontent.com/u/9308871?v=3","gravatar_id":"","url":"https://api.github.com/users/samcic","html_url":"https://github.com/samcic","followers_url":"https://api.github.com/users/samcic/followers","following_url":"https://api.github.com/users/samcic/following{/other_user}","gists_url":"https://api.github.com/users/samcic/gists{/gist_id}","starred_url":"https://api.github.com/users/samcic/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/samcic/subscriptions","organizations_url":"https://api.github.com/users/samcic/orgs","repos_url":"https://api.github.com/users/samcic/repos","events_url":"https://api.github.com/users/samcic/events{/privacy}","received_events_url":"https://api.github.com/users/samcic/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":0,"created_at":"2016-07-22T12:35:19Z","updated_at":"2016-07-22T12:35:19Z","closed_at":null,"body":"I'd like to propose a potential improvement in the direction of performance/optimization and get some comments from the community. I understand this is the right repo for this kind of thing.\r\n\r\nI work on a production Ember App. We're using up-to-date versions of the core stuff (Ember 2.6.0, Ember Data 2.6.1, jQuery 2.2.3, Ember CLI 2.6.1). The app uses a fair few components (not unusual I imagine). \r\n\r\nThe other day I happened to be perusing through the minified JS for our app's production build. I noticed that, as a result of Ember's delicious dynamic rendering of components, there were quite a few calls to JS functions in the source like the following:\r\n\r\n- Element.setAttribute\r\n- Document.createDocumentFragment\r\n- Document.createElement\r\n- Document.createComment\r\n- Document.createTextNode\r\n- Node.appendChild\r\n\r\nThe minification process can't reduce the names of these functions of course, so they really stand out when surrounded by e.g. minified variable names in the production build.\r\n\r\nNow I'm not a JS expert, but I started wondering if, in the interest of reducing the JS download footprint, it would be possible to define wrapper functions for these functions. I'm thinking in the loose direction of defining something like `Ember.sa=function(element, name, value){element.setAttribute(name,value);}`.\r\n\r\nTo get a very rough feeling for its impact, I did a basic find/replace of the function names above with two-or-three letter abbreviated versions. The size of our minified script reduced by over 15%. With gzip compression this difference dropped to just over 5% (arguably still a worthwhile saving if the implementation effort is minimal). Of course the n=1 sample of our app is not exactly representative of the effect such a change would have on all Ember apps though.\r\n\r\nMaking such a change might also raise other questions, like: would the additional function call in each case introduce a significant performance overhead?\r\n\r\nBefore anybody wastes time focusing on the details, I just wanted to throw the idea out there and see if anyone else sees any merit in it (or show-stopping reasons not for doing this kind of thing)."}}
{"actor":{"display_login":"samcic"}}