{"action":"created","issue":{"url":"https://api.github.com/repos/aurelia/binding/issues/401","repository_url":"https://api.github.com/repos/aurelia/binding","labels_url":"https://api.github.com/repos/aurelia/binding/issues/401/labels{/name}","comments_url":"https://api.github.com/repos/aurelia/binding/issues/401/comments","events_url":"https://api.github.com/repos/aurelia/binding/issues/401/events","html_url":"https://github.com/aurelia/binding/issues/401","id":153987799,"number":401,"title":"Slow DOM updates if using unshift on an array","user":{"login":"lukechilds","id":2123375,"avatar_url":"https://avatars.githubusercontent.com/u/2123375?v=3","gravatar_id":"","url":"https://api.github.com/users/lukechilds","html_url":"https://github.com/lukechilds","followers_url":"https://api.github.com/users/lukechilds/followers","following_url":"https://api.github.com/users/lukechilds/following{/other_user}","gists_url":"https://api.github.com/users/lukechilds/gists{/gist_id}","starred_url":"https://api.github.com/users/lukechilds/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/lukechilds/subscriptions","organizations_url":"https://api.github.com/users/lukechilds/orgs","repos_url":"https://api.github.com/users/lukechilds/repos","events_url":"https://api.github.com/users/lukechilds/events{/privacy}","received_events_url":"https://api.github.com/users/lukechilds/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"milestone":null,"comments":12,"created_at":"2016-05-10T11:52:26Z","updated_at":"2016-05-12T10:27:20Z","closed_at":null,"body":"I have a `posts` property that is an array of post objects displayed on the page. I have navigation buttons on the page that will make an api request and add multiple posts to the array, either at the start or the end of the array depending on which way they are navigating:\r\n\r\n```javascript\r\n// Insert results\r\nif(page == 'prev') {\r\n  this.posts.unshift(...response.posts);\r\n} else {\r\n  this.posts.push(...response.posts);\r\n}\r\n```\r\n\r\nWhen `Array.push()` is used it looks like the new appended objects get new appended elements in the DOM, this is really fast.\r\n\r\nAlternatively when `Array.unshift()` is used it seems new elements don't get **prepended**, instead it looks like the current elements stay the same and any extra elements are **appended** to the DOM so the count of DOM elements match the array length. The properties for each object in the DOM are then updated to be in sync. This seems much slower.\r\n\r\nThis is causing issues as I have an array observer listening for updates on the `posts` array. When it updates I need to check some stuff in the DOM. This works fine for `Array.push()` but with `Array.unshift()` rendering hasn't finished so I get incorrect DOM results.\r\n\r\nExample:\r\n\r\n```javascript\r\nthis.arrayObserver(this.posts).subscribe(() => {\r\n  this.taskQueue.queueMicroTask(() => /* DOM stuff here */);\r\n});\r\n```\r\n\r\nThis worked in older versions of Aurelia. It would appear this is some sort of performance improvement to try and reuse elements, however it's definitely degrading performance in this use case.\r\n\r\nIs there some sort of Aurelia event I can hook into that will fire when all Aurelia DOM stuff is finished for this array update? Or would I need to downgrade Aurelia to get this working again?"},"comment":{"url":"https://api.github.com/repos/aurelia/binding/issues/comments/218718842","html_url":"https://github.com/aurelia/binding/issues/401#issuecomment-218718842","issue_url":"https://api.github.com/repos/aurelia/binding/issues/401","id":218718842,"user":{"login":"EisenbergEffect","id":131485,"avatar_url":"https://avatars.githubusercontent.com/u/131485?v=3","gravatar_id":"","url":"https://api.github.com/users/EisenbergEffect","html_url":"https://github.com/EisenbergEffect","followers_url":"https://api.github.com/users/EisenbergEffect/followers","following_url":"https://api.github.com/users/EisenbergEffect/following{/other_user}","gists_url":"https://api.github.com/users/EisenbergEffect/gists{/gist_id}","starred_url":"https://api.github.com/users/EisenbergEffect/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/EisenbergEffect/subscriptions","organizations_url":"https://api.github.com/users/EisenbergEffect/orgs","repos_url":"https://api.github.com/users/EisenbergEffect/repos","events_url":"https://api.github.com/users/EisenbergEffect/events{/privacy}","received_events_url":"https://api.github.com/users/EisenbergEffect/received_events","type":"User","site_admin":false},"created_at":"2016-05-12T10:27:20Z","updated_at":"2016-05-12T10:27:20Z","body":"@lukechilds But, is there still a performance issue?"}}