🎉🎉🎉 YAAASSSS ITS FIXED!!!! After 3 days of debugging trial by fire, I fixed the post page loading issue. Woohoooo I wanna dance hahahahah! 🕺
Turned out, the culprit was a sort function for the comments v-for loop.
v-for="comment in sortedComments"
:key="comment"
>
...
computed: {
sortedComments() {
const x = this.post.comments
return x.sort(function (a, b) {
return a.id - b.id
})
},
}
Changed that function to using lodash's sortBy function and it works now!
import _ from 'lodash'
computed: {
sortedComments() {
return _.orderBy(this.post.comments, ['created_at'], ['desc'])
},
},
All thanks to @yuyu 's suggestion to comment out everything in _slug! That got me down the right path to debug this eventually! Note to self: always fall back to fundamentals when debugging - just comment out code first to isolate the bug. But the deeper mystery remains:
* why this worked before but not now
* the behaviour should be consistent on local and production, but it worked on local
* the function didn't crash the page if I entered the site via a different child page by directly typing in the url
* why lodash worked but a vanilla JS script didn't
:key="comment"
>
...
computed: {
sortedComments() {
const x = this.post.comments
return x.sort(function (a, b) {
return a.id - b.id
})
},
}
Changed that function to using lodash's sortBy function and it works now!
import _ from 'lodash'
computed: {
sortedComments() {
return _.orderBy(this.post.comments, ['created_at'], ['desc'])
},
},
All thanks to @yuyu 's suggestion to comment out everything in _slug! That got me down the right path to debug this eventually! Note to self: always fall back to fundamentals when debugging - just comment out code first to isolate the bug. But the deeper mystery remains:
* why this worked before but not now
* the behaviour should be consistent on local and production, but it worked on local
* the function didn't crash the page if I entered the site via a different child page by directly typing in the url
* why lodash worked but a vanilla JS script didn't