\"메모리 사용을 1/100로\"··· '프로그래시브 웹 앱' 확산
메이저 놀이터 순위트SW 포털
게시글 작성 시각 2017-07-03 09:05:48
2017년 6월 27일 (화)
ⓒ CIO Korea, Paul Krill | InfoWorld
일반적으로 네이티브 모바일 앱은 사용자 경험 측면에서 웹 앱 이상의 최신 기술을 사용해 왔다. 그러나 이런 이러한 흐름에 변화가 나타나고 있다. 프로그래시브 웹(progressive web) 앱이 등장했기 때문이다. 현재 구글과 모질라가 주도하는 기술로 주요 웹 속성과 개발 툴을 캐시하는 기술이다.
구글 크롬 팀의 애디 오스마니는 "트위터와 리프트 등 많은 거대 기업이 다시 웹으로 돌아오기 시작했다. 앱 오류를 최소화할 수 있기 때문이다"고 말했다.
트위터의 프로그래시브 웹 앱이 대표적이다. 트위터 라이트(Twitter Lit)라고 불리는 이 앱은 메모리를 1MB도 점유하지 않는다. iOS용 앱이 100MB 이상, 안드로이드 앱이 23MB를 점유하는 것과 비교하면 크게 사용량을 줄였다. 이와 같은 클라이언트 측 자바 스트립트 앱은 데이터를 더 적게 사용하고 푸시 알림을 지원하며 오프라인 상태에서도 사용할 수 있는 장점이 있다.
이런 기능을 지원하는 핵심은 서비스 워커(service workers)이다. 자바스크립트 기반의 클라이언트 측 프록시로, 브라우저 내에서 백그라운드 스트립트로 실행되며 네트워크 상태와 관계없이 지속적으로 앱을 호출할 수 있도록 한다. 또한 이런 앱은 네트워크 의존성을 줄이기 위해 핵심 리소스를 미리 캐시한다. 단 이 기술은 아직 개발 중인 단계다. 그래서 애플의 사파리 브라우저는 아직 서비스 워커를 지원하지 않는다.
하지만 웹 개발자가 프로그래시브 웹 앱을 만들 수 있는 툴은 오픈소스로 메이저 사이트 추천돼 있다. 오픈소스인 라이트하우스(Lighthouse) 툴을 이용하면 성능을 테스트할 수 있다. 리액트 자바스크립트 UI 라이브리리의 가벼운 대안인 프리액트(Preact)도 있다(리액트는 프로그래시브 웹 앱용으로도 사용할 수 있다). 실제 사례를 확인하고자 한다면 해커 뉴스 프로그래시브 웹 앱을 참고하면 된다.
구글 크롬 팀의 애디 오스마니는 "트위터와 리프트 등 많은 거대 기업이 다시 웹으로 돌아오기 시작했다. 앱 오류를 최소화할 수 있기 때문이다"고 말했다.
트위터의 프로그래시브 웹 앱이 대표적이다. 트위터 라이트(Twitter Lit)라고 불리는 이 앱은 메모리를 1MB도 점유하지 않는다. iOS용 앱이 100MB 이상, 안드로이드 앱이 23MB를 점유하는 것과 비교하면 크게 사용량을 줄였다. 이와 같은 클라이언트 측 자바 스트립트 앱은 데이터를 더 적게 사용하고 푸시 알림을 지원하며 오프라인 상태에서도 사용할 수 있는 장점이 있다.
이런 기능을 지원하는 핵심은 서비스 워커(service workers)이다. 자바스크립트 기반의 클라이언트 측 프록시로, 브라우저 내에서 백그라운드 스트립트로 실행되며 네트워크 상태와 관계없이 지속적으로 앱을 호출할 수 있도록 한다. 또한 이런 앱은 네트워크 의존성을 줄이기 위해 핵심 리소스를 미리 캐시한다. 단 이 기술은 아직 개발 중인 단계다. 그래서 애플의 사파리 브라우저는 아직 서비스 워커를 지원하지 않는다.
하지만 웹 개발자가 프로그래시브 웹 앱을 만들 수 있는 툴은 오픈소스로 메이저 사이트 추천돼 있다. 오픈소스인 라이트하우스(Lighthouse) 툴을 이용하면 성능을 테스트할 수 있다. 리액트 자바스크립트 UI 라이브리리의 가벼운 대안인 프리액트(Preact)도 있다(리액트는 프로그래시브 웹 앱용으로도 사용할 수 있다). 실제 사례를 확인하고자 한다면 해커 뉴스 프로그래시브 웹 앱을 참고하면 된다.
※ 본 내용은 한국IDG(주)(http://www.itworld.co.kr)의 저작권 동의에 의해 공유되고 있습니다.
Copyright ⓒITWORLD. 무단전재 및 재배포 금지
[원문출처 : http://www.ciokorea.com/news/34651]
| 번호 | 제목 | 조회수 | 작성 |
|---|---|---|---|
| 1267 | 과대포장의 속도를 따라가지 못하는 12가지 ‘최신 유행’ 기술 | 5233 | 2017-07-13 |
| 1266 | 클라우데라는 무엇으로 먹고 사는가 | 5525 | 2017-07-12 |
| 1265 | 빅데이터 분석 전략을 여는 6개의 열쇠 | 5838 | 2017-07-11 |
| 1264 | 오픈소스의 변화는 쿠버네티스의 몰락을 의미하는가 | 5158 | 2017-07-11 |
| 1263 | 리눅스용 윈도우 서브시스템 사용하기 | 4908 | 2017-07-11 |
| 1262 | "함수 언어 프로그래밍에 시각적 개발 구현"··· '루나'(Luna)의 약속 | 5515 | 2017-07-10 |
| 1261 | '애자일과 데브옵스, 이렇게 했다' CIO 4인의 조언 | 5239 | 2017-07-10 |
| 1260 | 도미노피자·월마트 등 10개 기업의 '각양각색' 디지털 변혁 | 6208 | 2017-07-10 |
| 1259 | "메모리 사용을 1/100로"··· '프로그래시브 웹 앱' 확산 | 5427 | 2017-07-03 |
| 1258 | 분산된 IoT 마이크로서비스에 P 언어가 필요한 이유 | 5778 | 2017-07-03 |
0개 댓글