Is there a standard/elegant way of achieving Firebase-like reactive objects without Firebase?

I never worked with pusher before, and I don't know exactly what's the "different set of books" you're referring to, but I think I can give you some starting point to make your code look a bit more elegant.

The first thing I suggest; do not try to reinvent the wheel, use component mixins. Just create a mixin like you'd normally consume your backend, make it work with some dynamic options (that you can set in the component's data()) and import it on every component you need the same functionality, with different options.

Example (you'll need to adapt it accordingly)

// Create an ES6 module and export this function, or the whole mixin// (in that case export the mixin instead)const initPusher = function ({pusher, collection, key, events}, component) {  collection = component[collection]  pusher.on(events.created, (record) => {    collection.push(record)  })  pusher.on(events.updated, (record) => {    let r = _.find(collection, {[key]: record[key]})    if(r){     _.extend(r, record)    }   })}const PusherMixin = {  methods: {    // You can add some common methods for all your    // components making use of this mixin  },  created () {    initPusher(Object.assign({}, {      pusher: Pusher,      collection: 'collection',      key: 'id',      events: {        created: 'book-created',        updated: 'book-updated'      }    }, this.pusherOptions), this)  }}new Vue({  el: "#app",  mixins: [PusherMixin],  data () {    return {      books: [],      pusherOptions: {        collection: 'books',        key: 'id',        events: {          created: 'book-created',          updated: 'book-updated'        }      }    }  }})

My second suggestion implied a manipulated array prototype with some custom methods and hooks to trigger events and XHRequests but after finishing the code for the mixin, I found out that extending the array's prototype with more methods was adding too much complexity, and a good mixin was totally the opposite of that.

If you want to go deeper, you may want to pay a look to RxJS and observables. You can build something on top of that with Pusher to get something like a Firebase real time object.

• Tutorial:https://blog.pusher.com/building-realtime-applications-with-cyclejs-and-rxjs/
• RxJS: http://reactivex.io/rxjs/
• Official implementation for Vue:https://github.com/vuejs/vue-rx