새로운 웹을 위한 준비, Deno

Cover by

입문서

이 글은 2월 말에 쓴 글이고 Fresh와 Astro는 아직 1.0에 도달하지 않았기 때문에 차기 핫템인 것처럼 이야기하고 있습니다(실제로 그들은 그렇게 되었습니다).

인정하건대, 이 게시물은 잘 구조화되지 않았으며, 웹 개발과 관련하여 Deno를 인식하는 방식이 대부분입니다. 정보가 다소 구식으로 보일 수 있음에도 불구하고 이러한 생각이 흥미롭기를 바랍니다.


denoland/dotland#2016이 병합됨에 따라 두 개의 공식 Deno 웹사이트가 Next.js에서 Deno로 마이그레이션되었습니다.

dotland : 메인 웹사이트

Deno 팀의 동형 프레임워크인 fresh에 의해 구동됩니다.

프런트 엔드: Preact

SSR(서버측 렌더링): Preact

서버: std/http/server

라우터: (custom)

번들러: esbuild(WASM)

docland : 문서 생성 웹 사이트

프런트엔드: (거의) 자바스크립트 없음

function copyImportStatement() {
    navigator.clipboard.writeText(`import * as mod from "https://deno.land/[email protected]/fs/mod.ts";
`);
}

제공하는 유일한 JavaScript 스니펫

SSR: Nano JSX

서버 및 라우터: oak

문서 생성: deno_doc (WASM)

두 웹사이트 모두 CSS에 Twind을 사용하고 Deno Deploy에서 호스팅됩니다.

비욘드 노드

Deno 웹사이트가 Node.js로 구동된다는 사실을 알고 계셨나요?

커뮤니티는 오랫동안 이를 요구해 왔지만ported to Deno 대답은 항상 "아직 없습니다"였습니다.

Next.js 대안을 구축하는 것은 사소한 작업이 아니지만 Deno 팀은 느리지만 이를 달성하고 있습니다. 앞서 언급한 새로운 프레임워크 외에도 다음을 만들었습니다.

dext.ts : Next.js에서 영감을 받은 프레임워크

이것은 Deno의 웹 사이트 구축 능력에 대한 초기 정보입니다. 태그 라인에도 불구하고 기능이 풍부하지는 않습니다.

packup : Parcel - 제로 구성 번들러와 유사

Aleph.js : Next.js에서 영감을 받은 프레임워크

이것은 경이롭고 유망합니다. A brand new version도 공사중입니다.

때가됐다

Deno 팀이 dogfooding을 시작하면 Deno가 적절한 규모의 웹사이트를 구축할 준비가 되었다고 믿습니다.

2021년 후반에 docland는 Deno를 완전히 활용하기 위해 rewritten from scratch 되었습니다. 이것은 dotland rewrite에 대한 테스트이자 전주곡 역할을 합니다.

위에 나열된 스택에서 몇 가지 관찰을 쉽게 할 수 있습니다.

표준 라이브러리(std/http/server)와 완전한 솔루션(oak)

사이의 유연한 선택

기존 웹 생태계(Preact, Twind)와의 호환성

WASM 통합을 통한 기본 기능(esbuild, deno_doc)

새로운 웹

웹은 완전한 원을 그리며 다시 다중 페이지 애플리케이션(MPA)에 맞춰져 있습니다.

2021년 11월에 출시된 Chrome 96은 모든 사용자에 대해 Back/forward cache(bfcache)를 활성화하여 MPA 경험을 크게 향상시킵니다.

최근에 프런트 엔드 작업을 수행한 경우 Vite에 대해 들어봤을 가능성이 있습니다. Vite에서 영감을 받은 도구인 Snowpack 뒤에 있는 팀은 초점을 Astro이라는 새 프로젝트로 옮겼습니다. Astro의 주요 기능은 Island Architecture 전통적인 정적 사이트 빌더(Hexo, Eleventy) 회의Static Generation라고 생각하십시오.

전체 스택 웹 프레임워크의 다음 경쟁자인 boutRemix도 읽었을 것입니다. 판매 포인트 중 하나는 Cloudflare Workers과 같은 에지 컴퓨팅 플랫폼에 배포할 수 있다는 것입니다.

이것이 바로 Deno 웹사이트가 취한 접근 방식입니다. Edge(Deno Deploy)와 더 나은 New Web을 포용합니다.

관련 리소스

, Rich Harris의 멋진 강연. 못 보셨다면 꼭 보시길 강추합니다.

👋 Hi DEV Community! Third time's a charm, isn't it? Like my last two posts, this is also originally posted on my Notion page.
I'd like to keep my random thoughts raw this time, thus few modifications are made this time. Still, suggestions are very much appreciated ✨!