Server side render error RangeError: Maximum call stack size exceeded

[pathawee]

Version

2.2.6

Reproduction link

#5444

Steps to reproduce

I got this error when I use v-for dynamic components on server side render.
If data less then 10 records it's work fine and use client render it's work too.
Error only use server side render. How do I solve?

<component v-for="element in dataItems" :is="element.name" :key="element.id"></component>
here is my json data

[
  {
    "id": "1",
    "name": "Layout12"
  },
  {
    "id": "2",
    "name": "Layout12"
  },
  {
    "id": "3",
    "name": "Layout12"
  },
  {
    "name": "Layout12",
    "id": "4"
  },
  {
    "name": "Layout12",
    "id": "5"
  },
  {
    "name": "Layout12",
    "id": "6"
  },
  {
    "name": "Layout12",
    "id": "7"
  },
  {
    "name": "Layout12",
    "id": "8"
  },
  {
    "name": "Layout12",
    "id": "9"
  },
  {
    "name": "Layout12",
    "id": "10"
  }
]

What is expected?

I would to use server side render with v-for dynamic components.

What is actually happening?

use v-for dynamic components on server side render from data more then 10 records
will get RangeError: Maximum call stack size exceeded

[yyx990803]

That is not a reproduction.