Commit a053f0d2be69c5c52982b03d4d5d57c7d2dc95ed

Authored by Jan Jongboom
1 parent 0a18f56785

WIP

Showing 5 changed files with 64 additions and 19 deletions

app/scripts/collections/messages.js View file @ a053f0d
... ... @@ -62,7 +62,7 @@
62 62 // first). Notice that `add()` do almost the same but for `commId`. Notice
63 63 // we are using `_id` which is not overlapping with backbone's default
64 64 // idAttribute which is `id`.
65   - mergeById: function (messages) {
  65 + mergeById: function (messages, silent) {
66 66 var currentMessages = this.models;
67 67  
68 68 function hasMessage(target) {
... ... @@ -73,7 +73,7 @@
73 73  
74 74 for (var i = 0, target; (target = messages[i]); i++) {
75 75 if (!hasMessage(target)) {
76   - this.add(target);
  76 + this.add(target, { silent: silent });
77 77 }
78 78 }
79 79 },
app/scripts/models/conversation.js View file @ a053f0d
... ... @@ -75,29 +75,30 @@
75 75 }
76 76 },
77 77  
78   - loadMessagesFromStorage: function (callback) {
  78 + loadMessagesFromStorage: function (silent, callback) {
  79 + console.log('LOAD MESSAGES FROM STORAGE!!!!!!');
79 80 var _this = this;
80   - var messages = [];
  81 + console.time('loadMessages');
81 82 DbManager.read({
82 83 store : DbManager.dbMessagesStore,
83 84 sortedBy : 'conversationId',
84 85 value : this.get('id'),
85   - loadWithCursor : true,
  86 + loadWithCursor : false,
86 87 continueOnError : true,
87 88 reverse: true,
88   - callback : function (error, item) {
89   - if (item && item.value) {
90   - var message = MessageModel.newFromStorage(item.value);
91   - messages.push(message);
92   - } else {
93   - _this.get('messages').mergeById(messages);
94   - if (callback) { callback(); }
95   - return;
96   - }
  89 + callback : function (error, items) {
  90 + console.time('createNewModel');
  91 + var messages = items.map(function(item) {
  92 + return MessageModel.newFromStorage(item);
  93 + });
  94 + console.timeEnd('createNewModel');
  95 + console.time('backbonemerge')
  96 + _this.get('messages').mergeById(messages, silent);
  97 + console.timeEnd('backbonemerge')
97 98  
98   - /* jshint es5:true */
99   - item.continue();
100   - /* jshint es5:false */
  99 + console.timeEnd('loadMessages');
  100 +
  101 + callback && callback();
101 102 }
102 103 });
103 104 },
app/scripts/router.js View file @ a053f0d
... ... @@ -134,12 +134,17 @@
134 134 global.historyCollection.findOrCreate(identifier, null,
135 135 function (err, result) {
136 136 var conversation = result.conversation;
137   - conversation.loadMessagesFromStorage();
138 137 conversation.set('isRead', true);
139 138 conversation.saveToStorage();
140 139 var cView = new ConversationView({
141 140 model: conversation,
142 141 scrollTop: scrollTop
  142 + });
  143 + var bulkInsert = conversation.get('messages').length === 0;
  144 + conversation.loadMessagesFromStorage(bulkInsert, function() {
  145 + if (bulkInsert) {
  146 + cView.bulkInsertDone();
  147 + }
143 148 });
144 149 _this.show(cView);
145 150 }
app/scripts/views/conversation.js View file @ a053f0d
... ... @@ -335,6 +335,16 @@
335 335 }
336 336 },
337 337  
  338 + bulkInsertDone: function () {
  339 + console.time('bulkInsertDone');
  340 + // Called after initial load and we have the messages on the model
  341 + this.model.get('messages').forEach(function(m) {
  342 + this._onAddMessageFast(m);
  343 + }.bind(this));
  344 + this.scrollToLastMessage();
  345 + console.timeEnd('bulkInsertDone');
  346 + },
  347 +
338 348 _onComposeMessage: function (message) {
339 349 message.mine = true;
340 350 this.model.get('messages').push(message);
... ... @@ -486,6 +496,8 @@
486 496 },
487 497  
488 498 _onAddMessage: function (message) {
  499 + console.time('onAddMessage');
  500 +
489 501 var isAtBottom = this._isAtBottom();
490 502 var isNotFirstChunk =
491 503 this._scrollView.scrollHeight > this._scrollView.clientHeight * 1.5;
... ... @@ -513,6 +525,7 @@
513 525 view.$el.hide();
514 526 }
515 527 }
  528 +
516 529 if (found === this.messageViews.length) {
517 530 this.$el.find('ul.messages').append(view.$el);
518 531 } else if (found === 0) {
... ... @@ -525,6 +538,21 @@
525 538 if (isAtBottom || message.mine) {
526 539 this.scrollToLastMessage();
527 540 }
  541 +
  542 + console.timeEnd('onAddMessage');
  543 + },
  544 +
  545 + // Add message function that just creates elements and adds them to DOM
  546 + _onAddMessageFast: function (message) {
  547 + console.time('onAddMessageFast');
  548 +
  549 + var view = this._createViewForMessage(message);
  550 + view.render();
  551 + this.listenTo(view, 'message:resend', this._resendMessage);
  552 +
  553 + this.$el.find('ul.messages').append(view.$el);
  554 +
  555 + console.timeEnd('onAddMessageFast');
528 556 },
529 557  
530 558 _onScroll: function () {
app/scripts/views/text-message.js View file @ a053f0d
... ... @@ -28,7 +28,11 @@
28 28 },
29 29  
30 30 render: function () {
  31 + console.time('toJSON');
31 32 var jsonModel = this.model.toJSON();
  33 + console.timeEnd('toJSON');
  34 +
  35 + console.time('other');
32 36 jsonModel.meta.timestamp = jsonModel.meta.date.getTime();
33 37 if (jsonModel.from.authorMsisdn) {
34 38 jsonModel.author =
35 39  
36 40  
37 41  
38 42  
... ... @@ -37,10 +41,17 @@
37 41 else {
38 42 jsonModel.author = jsonModel.from.displayName;
39 43 }
  44 + console.timeEnd('other');
  45 + console.time('template');
40 46 var newElement = this.template(jsonModel);
  47 + console.timeEnd('template');
  48 + console.time('setElement call');
41 49 this.setElement(newElement);
  50 + console.timeEnd('setElement call');
42 51  
  52 + console.time('emoji');
43 53 helpers.revealEmoji(this.$el.find('span.content'));
  54 + console.timeEnd('emoji');
44 55 },
45 56  
46 57 _requestResend: function () {