Performance in the test is terrible, is it normal in Meteor?

Here is a small test on the performance of Meteor 1.2.1.


performance.html
>
> performance
>

> <body>
>   <br><br>
>   <form class="search-form">
>     <input type="text" name="keyword" placeholder="Enter a keyword to search">
>   </form>
>   <br>
>   {{> items}}
> </body>

> <template name="items">
>   <table>
>     <thead></thead>
>     <tbody>
>       {{#each items}}
>         <tr>
>           <td>{{first}}</td>
>           <td>{{second}}</td>
>           <td>{{third}}</td>
>         </tr>
>       {{/each}}
>     </tbody>
>   </table>
> </template>

performance.js
> Items = new Mongo.Collection(ā€˜itemsā€™);

> if (Meteor.isClient) {
>   Template.items.helpers({
>     items: function () {
>       if (Session.get('input')) {
>         var keyword = Session.get('input');
>         var regex = new RegExp(keyword, "i");
>         return Items.find({$or: [{first: regex}, {second: regex}, {third: regex}]});
>       } else {
>          return Items.find();
>       }
>     }
>   });
>   Template.body.events({
>     "submit .search-form": function (events) {
>       events.preventDefault();

>       var input = events.target.keyword.value;
>       Session.set('input', input);
>     }
>   });
> }

> if (Meteor.isServer) {
>   Meteor.startup(function () {
>     // code to run on server at startup
>     if (Items.find().count() < 5000) {
>       for (var i = 1; i <= 5000; i++) {
>         Items.insert({first: 'first_' + i, second: 'second_' + i, third: 'third_' + i, createdAt: new Date()});
>       }
>     }
>   });
> }

When I load or refresh the page Chromeā€™s developer tools shows it took about 3 seconds. And if I input, e.g., 1 and hit enter, then it looks like no response for a few seconds but will show the result at last.
Maybe some suggestion said donā€™t return all from collections, but really itā€™s not a big data (5k docs, 3 simple fields) return, I also did the same thing by using Laravel 5 and MySQL, it works pretty smoothly, and I tried some query in Mongodb CLI also looks good, so whatā€™s the problem on the performance of Meteor?

well, 5k documents is no fun, you should do server side search.
And also client side, 5k DOM elements to generate take some time.
If u r doing filtering, I suggest generate for example ā€œvisibleā€ property and based on that set/unset visible class.
So it will always be 5k DOM elements, but classes change, not structure and visibility would be handled by CSS for free.
That way the filtering should work much much faster if you really want it client side.

And check search packages on atmosphere, some have built-in server side search etcā€¦

Initial load can be faster with fast-render package.

Learn https://developer.chrome.com/devtools/docs/timeline and you can answer your question yourself :wink: :smile:

2 Likes

Your idea to set ā€œvisibleā€ property is excellent. Actually I did search on server side before this test, but Iā€™m not sure itā€™s the same thing you mention, Iā€™ll to search the packages on atmosphere.
I saw every time when the page refresh, Meteor will load about 80 requests, some of them takes time.
Thanks for your suggestion, Iā€™ll continue with Meteor.

you sure its the same thing? :slight_smile:

Im not trolling - Laravel is wonderful. Just your mb not comparing like with likeā€¦

Of course PHP way and Meteor way is not same, what I mean is implements same functions.

thanks:wink:, some of them I didnā€™t know.

how the filter time changed using classes?

Thatā€™s because you use development environment. In production itā€™s totally different.