안녕하세요. 최근 회사에 입사해서 single page web을 제작중인 학생입니다. frontend 사이드로 입사해서 기존의 홈페이지를 교체하는 작업을 진행하고있는데요, single page와, 기존의 링크가 유지되어야 한다는 조건이 있어서 hybrid rendering을 해야 한다 생각하였습니다.

BE 환경

• spring
• jsp

FE 환경

• Backbone
• gulp
• requirejs
• handlebars

기존의 서버는 spring이고 이미 많은것이 구현되어 있어서 spring을 그대로 유지해야 하는데요. 문제는 클라이언트와 서버의 서로다른 템플릿입니다. spring에대해 지식이 없고 어떻게 hybrid rendering을 구현해야하는지 막혀서 질문을 하게 되었습니다.

처음 전략은 매우 심플합니다.

1. 프론트엔드사이드에서 single page로 빌드를 해서 테스트를 하고나서, 기존의 템플릿(handlebars)를 수동으로 jsp로 새로 작성한다.

그렇게 틀린 방법은 아니라고 생각하지만 문제는 금방 나타났습니다. 로그인이나, 장바구니같은 것을 만들기위해서 본 서버에 올리면서 request를 주고받는 테스트를 해야하는데 이런 rest api를 테스트 할때마다 jsp를 작성해야하는 상황이 된것입니다. 이렇게 되면 grunt, gulp를 쓰는 이유가 많이 퇴색 되었습니다.

그래서 몇가지 해결첵을 생각해보았습니다.

2. 템플릿을 공유한다.

서버와 클라이언트가 같은 템플릿을 사용하면 해결될 문제입니다. spring과 js에서 함께 사용할 수 있는 템플릿이 무엇이 있을까? 찾아본 결과 mustache가 있었습니다. spring에서 mustacheViewResolver를 쓰자 하는 생각으로 찾아보았고 js에서는 상관이 없었지만 문제는 java에서 였습니다.

• mustache가 일반적으로 java에서 사용하는 템플릿이 아니라서 업데이트나 그 라이브러리의 완성도가 부족하다
• 신뢰할만한 viewResolver 라이브러리가 존재하지 않는다.
• 발전중이 아니다. ( 회사에서 지속적으로 사용할 방법인데 구조로 사용하기엔 비건설적인 방향이다.)

후에 찾은 jade4j도 비슷한 이유와, jade자체가 속도가 느린 문제가 있습니다.

3. nashorn을 사용한다

다음 알게된건 java 8에 등장한 스크립트엔진 nashorn입니다. 자바에서 엔진을돌려 javascript를 실행할 수 있게 해주는 것인데 이것으로 js template engine을 돌려 viewResolver를 만들 수 있습니다. 최근 뜨는 react.js등을 spring mvc에서 돌리기위해 많이 사용하는 방법인 것 같습니다. 이를 사용하면 mustache도 handlebars도, 심지어 ejs도 사용 할 수 있습니다. 그런데 걱정이 있습니다.

• nashorn은 신뢰할만한가? ( 버그나 템플릿엔진을 돌리면서 생기는 이슈들이 있지 않을까?)
• 퍼포먼스는 어떠한가? ( js엔진을 돌려 스크립트를 실행하면 너무 늦어지거나 하진 않을까?)
• 디버깅? ( 클라이언트에서는 돌아가지만 nashorn에서는 돌아가지 않는다면?)
• 계속 업데이트 되고 있는가? ( 지속적으로 사용할 만한 라이브러리인가?)

너무 신세계인 nashorn을 만들고 적합하지 않을때 아니네 하고 부수기에는 시간이 조금 촉박하였습니다.

4. node.js와 함께 돌린다.

이건 제가 생각해본 방법입니다. db를 따로 분리해 서버를 운영하듯이, viewResolver를 또다른 node.js서버로 대체하여 view만을 렌더링하기위한 서버로 운영하는 것입니다. 이것에 대해선 레퍼런스를 찾을 수 없었습니다. 혹시 알고있는 레퍼런스가 있다면 알려주세요.

장점이라면, spa에서 view rendering server와 동형 자바스크립트로 돌릴 수 있고 클라이언트와 얽혀있는 view를 완전히 spring서버에서 분리할 수 있다는 점이라 생각합니다. 제 생각은 다음과 같습니다.

• 브라우저가 서버로 request를 보낸다.
• 서버의 controller가 view서버의 특정라우터로 모델데이터와 assets 등을 넘긴다.
• view서버가 response를 보낼때까지 기다리고, response를 받아 클라이언트로 전송한다. (혹은 view rendering server가 클라이언트로 결과를 전송한다.)

문제는 참 많습니다.

• 서버간의 통신은 어떻게 해야하나? (spring2nodejs nodejs2spring, 그리고 통신에 사용할 적합한 라이브러리가 있는가)
• 퍼포먼스는 어떻게 되나? ( 속도는 느려지지 않는가? )
• 서버를 분리하면 한쪽 서버에 문제가 생기면 어떻게 핸들링해야할까?
• 한 인스턴스에서 서로다른 포트로 두개를 동시에 돌려야 하나, 아니면 서로다른 인스턴스에서 각각의 서버를 돌려 통신해야하나?

이런 고민들을 안고 있습니다. 프론트엔드는 언제던 gulp던 grunt던 angular던 backbone이던 react, handlebars, ejs 등등등 바꾸어도 금방금방 해날 자신이 있는데 서버가 spring으로 고정되어있으니 걱정이 많네요. 혹은 'single page와, 기존의 링크가 유지되어야 한다는 조건'을 너무 어렵게 해결하려 하는건 아닌지 의문도 들고있습니다. 참고할만한 링크나 많은 의견 주시면 정말 감사하겠습니다.