저는 타이틀 엄마, 리오입니다.매일 휴대용 Z의 업데이트에 따라 js를 사용했습니다.데일리뉴스 Z(이하 DPZ)는 무엇입니까?전체 내막을 갱신하고 싶으신 분들은 여기 기사.과이쪽 영상(롱)를 보십시오.

왜?js예요?

이것은 크게 두 가지 이유로 나뉜다.

DPZ 는 매우 인기 있는 오래된 사이트 이다

DPZ는 월 1천500만PV의 인기몰이 사이트다.1일 여러 기사가 업데이트됐고, 트위터에 참여하는 실시간성 높은 기획도 있었다.유량도 매우 크다.과거 보도도 만 단위로 존재하며 모든 페이지의 사이드바에 있는 새로운 보도와 인기 보도를 업데이트해야 하는 부분이다.한마디로 캐시(CDN)와는 맞지 않는다.보통 생각하면 Ajax로 사이드바를 읽고 싶어요.

업데이트입니다. 하지만 디자인은 그렇고 HTML/CSS도 그렇습니다.

데이터가 있는 미디어라면 지금 유행하는 단일 앱을 쓰면 좋지 않을까요.하지만 이번 갱신의 조건은 인프라와 CMS의 변경뿐이다.디자인도 변하지 않으면 HTML/CSS도 그대로 유지됩니다.엄밀히 말하면 갱신이 좋은지 나쁜지 모두 미묘하다.
한 마디로 하면 오래된 jQuery가 있는 사이트에서 HTML 구조를 바꾸지 않고 SPA의 일부분만 하려고 한다.만약 이 조건이라면, 리오.나는 js가 가장 적합하다고 생각한다.

그때까지의 HTML은 잠시 그렇게 맞춤형으로 태그를 만들 수 있어요.

어려운 일은 고려하지 않고 똑같은 HTML을 사용자 정의 탭으로 만들 수 있습니다.학습 곡선의 작음도 이어져 있어 새로 개발할 때도 추천할 수 있는 포인트다.

경량이랑 jQuery랑 잘 어울려요.

이미 하나의 사이트가 있는데 많은 경우에 jQuery에 가입했고 그 안에는 jQuery에 의존하는 프로그램 라이브러리가 많다.여기에 jQuery 세계관이 아닌 라이브러리를 추가하면 전체 JS 파일의 용량이 매우 높아진다.jQuery에서 벗어날 수 없으니 jQuery와 일치하는 경량 도서관이 더 좋지 않겠는가.

만약 그렇게 설계한다면 따로 논할 필요가 없다.js 가입할 필요도 없는 거 아니에요?

이런 의문도 당연하다.참고로 업데이트 전에는 어땠어요?즉, 같은 사이드바는 자바스크립트로 업데이트되고document.write()는 HTML 소스를 DOM에 삽입하는 방식이다.다만, 이 구조를 남기고 싶지 않은 건지.이 방식은 HTML 구조의 변경에 매우 약하다.데이터 원본은 JSON 형식으로 얻어지고 사용자 정의 탭에 위탁된 것을 표시합니다.이렇게 데이터와 구조를 분리하면 CMS에서 나온 데이터 출력 부분에 대해 어떠한 변경도 하지 않고 사용자 정의 라벨만 변경하면 디자인 변경에 대응할 수 있다.이번에는 맞춤형 라벨화를 통해 향후 디자인 업데이트 시 작업 시간을 대폭 줄일 것으로 기대할 수 있다.

Riot.js 도입 너무 좋아요.

짧은 시간 내에 프로젝트에서 예상대로 작업을 진행하면 최소한의 인프라 시설에서 대량의 업무를 처리하는 데 도움이 된다.나는 이것이 매우 좋은 결과라는 것에 매우 만족한다.

더 나아지고 싶은 점.

나는 API의 종점을 다시 고려하여 효율을 높이고 싶다.각 부품마다 API의 끝점이 있지만 그에 따른 요구 사항도 늘어납니다.

// ヘッドラインパーツの読み込み
$.getJSON("/api/dpz/headline", function (data) {
    riot.mount('dpz-headline', { items: data }
});

SPA라면 필요한 부품만 업데이트하면 좋겠지만 DPZ는 전체적으로 일반적인 사이트일 뿐이다.링크를 클릭하면 페이지로 이동하여 모든 위젯의 Ajax 요청부터 다시 시도합니다.나는 단점수를 줄여야 할지, 아니면 읽는 것을 지연시켜야 할지 생각한다.

Riot.희망

간단하게 가져올 수 있고 문서도 가능한 한 필요한 것을 수집해야 하기 때문에 좋은 것이지만 일단 가져온 후의 실천적인 정보는 찾기 어렵다.앞으로도 DPZ 유지보수 개선을 계획하고 있기 때문에 학습회 등에서 정보를 얻을 수 있다면 기쁠 텐데...활성화를 기대하고 싶어요!