eunja511005 / AutoCoding

0 stars 0 forks source link

UI 다국어 처리 #93

Open eunja511005 opened 1 year ago

eunja511005 commented 1 year ago

태그를 이용한 다국어 처리(<fmt:message>)와 message.js를 이용한 다국어 처리 방식은 각각 장단점이 있습니다.

  1. 태그를 이용한 다국어 처리(<fmt:message>)의 장단점:

    • 장점:
      • 간편한 사용: JSP 파일에서 태그를 사용하여 다국어 메시지를 처리하는 것이 간단하고 직관적입니다.
      • 서버 사이드 처리: 다국어 메시지는 서버에서 처리되기 때문에 클라이언트 사이드의 추가적인 로직이 필요하지 않습니다.
    • 단점:
      • 페이지 로딩 시 모든 다국어 메시지를 서버에서 가져와야 함: 모든 다국어 메시지를 페이지 로딩 시점에 서버에서 가져오기 때문에 초기 로딩 시간이 늘어날 수 있습니다.
      • JSP 파일 수정 필요: 다국어 메시지를 사용하는 JSP 파일마다 태그를 추가해야 하므로, 코드 수정이 필요할 수 있습니다.
      • 서버 부하: 매번 페이지 요청마다 서버에서 다국어 메시지를 가져와야 하기 때문에 서버에 부하가 발생할 수 있습니다.
  2. message.js를 이용한 다국어 처리의 장단점:

    • 장점:
      • 클라이언트 사이드 처리: message.js 파일을 클라이언트에 포함시켜 다국어 메시지를 클라이언트에서 처리하므로, 서버의 부하를 줄일 수 있습니다.
      • 비동기 방식으로 다국어 메시지 로딩: message.js 파일을 비동기로 로딩하여 페이지 로딩 시간을 최소화할 수 있습니다.
      • 독립적인 다국어 파일 관리: message.js 파일에 다국어 메시지를 정의하므로, 다국어 관련 파일들을 따로 관리할 수 있습니다.
    • 단점:
      • 클라이언트 스크립트 의존: 클라이언트 사이드에서 다국어 처리를 위해 message.js 파일을 로딩해야 하므로, 클라이언트 스크립트 의존성이 생깁니다.
      • 스크립트 파일 관리: message.js 파일을 관리해야 하며, 다국어 메시지가 변경될 경우 해당 파일을 수정해야 합니다.
      • 추가적인 로직 필요: message.js 파일을 로딩하고 다국어 메시지를 처리하는 로직을 구현해야 하므로, 조금 더 복잡할 수 있습니다.

각 방식은 상황과 개발자의 선호도에 따라 선택될 수

있습니다. 태그를 이용한 다국어 처리는 서버 사이드에서 처리되고 간단한 사용법이지만, 모든 다국어 메시지를 서버에서 가져와야 하고 서버 부하가 발생할 수 있습니다. 반면, message.js를 이용한 다국어 처리는 클라이언트 사이드에서 처리되어 서버 부하를 줄일 수 있으며, 비동기 방식으로 다국어 메시지를 로딩하여 초기 로딩 시간을 최소화할 수 있습니다. 그러나 클라이언트 스크립트 의존성과 스크립트 파일 관리 등의 추가적인 고려사항이 있습니다. 상황에 맞게 장단점을 고려하여 선택하시면 됩니다.

eunja511005 commented 1 year ago

사용자가 많은 웹 서비스에서는 주로 message.js를 이용한 클라이언트 사이드 다국어 처리 방식을 선호하는 경향이 있습니다. 이는 다음과 같은 이유로 인해 선호될 수 있습니다:

  1. 서버 부하 감소: 많은 사용자가 동시에 서버에 다국어 메시지를 요청하는 경우, 서버 부하가 증가할 수 있습니다. message.js를 이용한 클라이언트 사이드 다국어 처리는 서버의 역할을 줄이고 클라이언트에서 다국어 메시지를 처리하기 때문에 서버 부하를 감소시킬 수 있습니다.

  2. 빠른 초기 로딩 시간: 웹 페이지의 초기 로딩 시간은 사용자 경험에 큰 영향을 미칩니다. message.js를 비동기로 로딩하면 페이지 로딩이 더 빠르게 이루어지고, 다국어 메시지는 필요할 때 클라이언트에서 로드됩니다. 따라서 초기 로딩 시간을 최소화하여 사용자에게 빠른 응답 속도를 제공할 수 있습니다.

  3. 독립적인 다국어 파일 관리: message.js 파일에 다국어 메시지를 정의하면, 다국어 관련 파일들을 따로 관리할 수 있습니다. 다국어 메시지 변경이 필요한 경우 해당 파일만 수정하면 되므로 유지보수와 협업에 용이합니다.

  4. 클라이언트 사이드 자유도: 클라이언트 사이드에서 다국어 처리를 할 수 있는 자유도가 높아집니다. 자바스크립트를 사용하여 동적으로 다국어 메시지를 처리하거나, 다국어 관련 기능을 확장하고 개선할 수 있습니다.

단, message.js 방식을 선택할 때에는 클라이언트 스크립트 의존성과 스크립트 파일 관리에 대한 고려가 필요하며, 다국어 메시지가 동적으로 변경되는 경우 적절한 캐싱 및 업데이트 전략을 고려해야 합니다.

eunja511005 commented 1 year ago

다국어 처리에 대한 전체적인 가이드를 제공해드리겠습니다. 대용량 웹 서비스에서의 다국어 처리를 고려할 때 다음과 같은 전반적인 가이드라인을 따를 수 있습니다:

  1. 서버 측 다국어 처리:

    • 메시지 소스 설정: 스프링 부트에서는 message.properties 파일을 사용하여 다국어 메시지를 관리합니다. 각 언어에 해당하는 메시지 파일을 생성하고, MessageSource를 구성하여 메시지 소스로 사용합니다.
    • Locale 설정: 사용자의 언어 설정에 따라 Locale을 결정하고, 해당 Locale에 맞는 다국어 메시지를 가져옵니다. 사용자의 Locale은 주로 브라우저의 언어 설정 또는 사용자 프로필에서 설정된 언어를 기반으로 결정됩니다.
  2. JSP에서의 다국어 처리:

    • <fmt:message> 태그 사용: JSP에서는 <fmt:message> 태그를 사용하여 다국어 메시지를 표시합니다. 해당 메시지의 키를 지정하면, 현재 Locale에 맞는 메시지가 자동으로 표시됩니다. 예를 들어 <fmt:message key="nav.login" />와 같이 사용할 수 있습니다.
  3. JavaScript에서의 다국어 처리:

    • 서버로부터 초기에 모든 다국어 메시지를 가져오는 방식: 위에서 설명한 방법으로 서버로부터 한 번에 모든 다국어 메시지를 가져와 JavaScript 파일에 저장합니다. 이렇게 하면 클라이언트 측에서 JavaScript를 통해 다국어 메시지에 접근할 수 있습니다.
    • JavaScript 객체 또는 모듈 사용: JavaScript에서는 메시지를 저장하고 사용하기 위해 JavaScript 객체 또는 모듈을 사용할 수 있습니다. 초기에 모든 다국어 메시지를 저장하고, 필요한 곳에서 해당 메시지를 사용하도록 구현할 수 있습니다.
  4. 다국어 전환 기능:

    • 사용자 언어 선택 기능: 사용자가 언어를 선택할 수 있는 기능을 제공하여 원하는 언어로 전환할 수 있도록 합니다. 이는 쿠키, 세션, 사용자 프로필 등을 활용하여 사용자의 언어 설정을 유지하는 방식으로 구현할 수 있습니다.
    • 언어 전환 시 페이지 리로드: 다국어 전환 시 페이지를 새로고침하여 해당 언어에 맞는 메시지와 레이아웃을 표시합니다. 이를 위해 언어 전환 요청을 서버로 전달하고, 서버에서 적절한 Locale로 설정하여 새로고침된 페이지를 제공합니다.

위의 가이드라인을 참고하여 서버 측

에서 메시지 관리와 Locale 설정을 처리하고, JSP와 JavaScript를 사용하여 각각의 역할에 맞게 다국어 처리를 구현할 수 있습니다. 사용자가 많은 대용량 웹 서비스에서는 초기에 모든 다국어 메시지를 클라이언트로 전송하는 방식을 고려하여 서버의 부하를 줄이고, 빠른 응답 속도를 제공할 수 있습니다.

eunja511005 commented 1 year ago

자바스크립트 임시 메세징 처리

image


image