Front-end performance - Making lunr.js fast

Three stories about making lunr.js searching fast

Transcript

1. FRONT-END PERFORMANCE MAKING LUNR.JS FAST Thursday, 2 May 13
2. 100% CPU BOUND Thursday, 2 May 13
3. PROFILE TOOL Thursday, 2 May 13
4. BENCHMARK ๏ CONSOLE.TIME(‘ZOMG SLOW’) ๏ JSPERF.COM ๏ BENCHMARK.JS BEFORE & AFTER Thursday, 2 May 13
5. DO LESS GO QUICKER Thursday, 2 May 13
6. lunr.Vector = function (elements) { this.elements = elements for (var i = 0; i < elements.length; i++) { if ( !(i in this.elements) ) this.elements[i] = 0 } } BEFORE Thursday, 2 May 13
7. lunr.Vector = function (elements) { this.elements = elements } AFTER Thursday, 2 May 13
8. var zeros = [0] var zeroFillArray = function (length) { while (zeros.length < length) { zeros = zeros.concat(zeros) } return zeros.slice(0, length) } ELSEWHERE Thursday, 2 May 13
9. RESULTS 10 100 1000 10000 100000 1000000 NON ZERO FILLED ARRAY ZERO FILLED ARRAY 774,676 ops/s 3,234 ops/s http://jsperf.com/lunr-vector-init Thursday, 2 May 13
10. LESS RECURSION FUNCTION OVER-HEAD Thursday, 2 May 13
11. EVIDENCE Thursday, 2 May 13
12. lunr.TokenStore.prototype.getNode = function (token, root) { var root = root || this.root, key = token[0], rest = token.slice(1) if (!(key in root)) return {} if (rest.length === 0) { return root[key] } else { return this.getNode(rest, root[key]) } } BEFORE Thursday, 2 May 13
13. lunr.TokenStore.prototype.getNode = function (token) { if (!token) return {} var node = this.root for (var i = 0; i < token.length; i++) { if (!(token[i] in node)) return {} node = node[token[i]] } return node } AFTER Thursday, 2 May 13
14. RESULTS 40000 80000 120000 160000 RECURSIVE ITERATIVE 152,008 ops/s 103,070 ops/s http://jsperf.com/lunr-tokenstore-getnode/2 Thursday, 2 May 13
15. BIG OHHH CHOOSING THE RIGHT ALGORITHM Thursday, 2 May 13
16. lunr.SortedSet = function () { this.length = 0 this.elements = [] } SIMPLE DATA STRUCTURE Thursday, 2 May 13
17. OPERATIONS ๏ ADD(ELEM) ๏ INDEX_OF(ELEM) SORTED SET Thursday, 2 May 13
18. lunr.SortedSet.prototype.add = function (elem) { if (~this.elements.indexOf(elem)) return this.elements.push(elem) this.length++ this.elements.sort() } BEFORE Thursday, 2 May 13
19. SORT O(n log n) Thursday, 2 May 13
20. INDEX_OF O(n) Thursday, 2 May 13
21. lunr.SortedSet.prototype.add = function (elem) { if (~this.indexOf(elem)) return this.elements.splice(this.locationFor(elem), 0, elem) this.length = this.elements.length } AFTER Thursday, 2 May 13
22. BINARY SEARCH O(log n) Thursday, 2 May 13
23. lunr.SortedSet.prototype.indexOf = function (elem, start, end) { var start = start || 0, end = end || this.elements.length, sectionLength = end - start, pivot = start + Math.floor(sectionLength / 2), pivotElem = this.elements[pivot] if (sectionLength <= 1) { if (pivotElem === elem) { return pivot } else { return -1 } } if (pivotElem < elem) return this.indexOf(elem, pivot, end) if (pivotElem > elem) return this.indexOf(elem, start, pivot) if (pivotElem === elem) return pivot } ELSEWHERE Thursday, 2 May 13
24. lunr.SortedSet.prototype.locationFor = function (elem, start, end) { var start = start || 0, end = end || this.elements.length, sectionLength = end - start, pivot = start + Math.floor(sectionLength / 2), pivotElem = this.elements[pivot] if (sectionLength <= 1) { if (pivotElem > elem) return pivot if (pivotElem < elem) return pivot + 1 } if (pivotElem < elem) return this.locationFor(elem, pivot, end) if (pivotElem > elem) return this.locationFor(elem, start, pivot) } MORE ELSEWHERE Thursday, 2 May 13
25. RESULTS 100 10000 1000000 LOW VALUE HIGH VALUE NON EXISTANT INDEX_OF BINARY_SEARCH INDEX_OF BINARY_SEARCH INDEX_OF BINARY_SEARCH 4,818,044 ops/s 5,521,920 ops/s 4,768,333 ops/s 14,445 ops/s 23,150 ops/s 1,697,089 ops/s http://jsperf.com/lunr-sortedset-indexof Thursday, 2 May 13
26. END USER PERF THIS IS WHAT REALLY MATTERS Thursday, 2 May 13
27. RESULTS 75 150 225 300 0.2.0 0.4.0 38.477 ms 240.865 ms lunr.Index.prototype.search Thursday, 2 May 13