따라서 이미 서버 측 렌더링 페이지를 차지하는 angularjs에 대한 커뮤니티 조언을 원합니다.
angularjs는 훌륭합니다! 그러나 첫 페이지로드 성능과 SEO에 관해서는 실질적인 단점이 있습니다. 분명히 angularjs는 서버 측 렌더링과 호환되지 않습니다.
간단히 말해서 서버 측에서 페이지를 렌더링하고 모든 데이터로 가능한 한 빨리 사용자 / 봇에게 다시 가져오고 싶습니다. 그런 다음 백그라운드에서 각을 부트 스트랩하여 페이지 동작을 적용합니다. 새 데이터를로드하라는 요청이있을 때 모든 것을 새로 고치지 않고 데이터를로드하고 콘텐츠에 바인딩하고 html을 얻기 위해 왕복하고 싶습니다.
현재 는 서버 측 템플릿 엔진에 Velocity 를 사용하여 렌더링 된 페이지를 만든 다음 angular.bootstrap 비동기를 사용하여 각도를 적용합니다.
솔루션 문제 :
two view tech-페이지를 두 번 렌더링합니다 (두 번째에는 아무 일도 일어나지 않지만 코드를 두 번 작성합니다).
Velocity는 뷰를 작성하는 가장 쉬운 방법이 아닙니다. 그것은 꽤 오래된 기술이고 나는 그것을 정말로 좋아하지 않습니다.
그래서, 당신의 의견은 무엇입니까? 미리 감사드립니다 !!!
SEO의 경우 가장 좋은 방법은 사전 렌더링 된 HTML 스냅 샷을 검색 엔진 크롤러에 제공하는 것입니다.
기본적으로 검색 엔진 크롤러는 특정 쿼리 문자열 매개 변수를 사용하여 페이지를 방문하여 실제 사용자가 아닌 크롤러임을 식별합니다. URL 패턴을 감지하면 페이지의 사전 렌더링 된 JavaScript없는 스냅 샷을 제공 할 수 있습니다.
이에 대한 Google의 설명을 확인하십시오 : https://developers.google.com/webmasters/ajax-crawling/docs/html-snapshot
첫 번째 페이지로드의 경우 부트 스트랩 전에 이중 중괄호가 표시되면 ng-bind 지시문 ( https://docs.angularjs.org/api/ng/directive/ngBind )을 사용하십시오. 데이터가 검색되기 전에 페이지가 표시되는 방식이 마음에 들지 않으면 컨트롤러에서 해결을 사용하거나 적절한로드 표시기 (스피너, "로드 중 ..."또는 원하는대로)를 표시하여 사용자에게로드 중임을 알립니다. 진행 중입니다.
Resolve는 기본 Angular 라우터와 ui-router 모두에서 지원됩니다. 사용 방법에 대한 예제를 온라인에서 찾을 수 있습니다.
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다