source

Vue.js, Vuex, Vue-Router SPA 및 애플리케이션 클라이언트 측과 서버 측 간의 확장

factcode 2023. 1. 29. 20:16
반응형

Vue.js, Vuex, Vue-Router SPA 및 애플리케이션 클라이언트 측과 서버 측 간의 확장

  1. 아주, 아주, 아주, 크고 복잡한 애플리케이션을 다시 쓰고 있어요.
  2. Vue/Vuex/Vue 라우터를 사용하고 있다
  3. 이것은, 데스크탑과 같은 퍼시스턴트한 UI 를 갖춘 1 페이지 애플리케이션입니다.
  4. 그것은 150개가 넘는 '형태'를 가지고 있으며, 이는 약 그 많은 물체에 해당한다.
  5. 정기적으로 새로운 양식을 추가해야 합니다.
  6. 각 폼을 모달로 표시한다고 가정합니다(그렇지 않지만 상상하기 쉽습니다).
  7. 앱은 이미 15MB 정도 됩니다.

이러한 폼에 대해서, 서버상에서 렌더링 해 모달에 로드하는 것과 애플리케이션에 컴포넌트를 포함시켜 클라이언트와 서버의 책임을 분리하는 것 중 어느 것을 고려해야 합니까?

즉, 때때로 재다운로드 비용을 지불하거나 클라이언트와 서버 간의 책임 분리와 어텐던트 서버 부하 비용을 지불합니다.현재 백엔드는 api에 불과하기 때문에 앱과 백엔드를 분리해 두고 싶습니다.다만, 앱의 사이즈가 커져, 새로운 형태(기능)를 발행하는 것을 꺼릴까 걱정입니다.

유감스럽게도 Vue에서 이런 규모의 제품을 만들어 본 경험이 없다면 20MB의 정기적인 업데이트인지 200MB의 업데이트인지 예측할 수 없습니다.

잘 부탁드립니다.

감사해요.

다음의 3가지 선택지가 있습니다.

  • 1 - 예를 들어 Laravel/blade 또는 이와 동등한 방법으로 서버에 렌더링하여 vue app에 표시하기만 하면 됩니다.
  • 2 - 서버에서 vue로 렌더링합니다.
  • 3 - 앱에 통합합니다.

결정 기준은 다음과 같습니다.

  • 1 - encapsulation : app과 api의 분리를 유지하거나 api를 파괴합니다.
  • 2 - 경험: 새로운 기능(api 서비스)이 제공됨에 따라 다운로드 빈도가 높아지지만 스파 체험을 유지할 수 있습니다.아니면 그 반대일 수도 있죠.

사용자 경험뿐만 아니라 UI와 API의 분리를 유지하기 위해 사이즈가 증가하더라도 다운로드 빈도를 높이는 방법을 선택하였습니다.또한 비교적 간단한 빌드 및 도입 프로세스를 유지했습니다.

언급URL : https://stackoverflow.com/questions/49137465/vue-js-vuex-vue-router-spa-and-scaling-the-app-client-side-vs-server-side

반응형