JSer.info #599 - Next.js 12.2가 릴리스 됐다.
Middleware와 On-Demand ISR가 안정적(stable)인 기능으로 전환 됐다.
API Route와 SSR을 Cloudflare Workers 기반 Edge에서 동작하게 하는 runtime
옵션 추가.
이와 함께 Edge Runtime을 로컬에서 에뮬레이터 하기 위한 edge-runtime
패키지도 공개 됐다.
그 이로 next/image
개선, SWC 플러그인 지원, React 18 지원 개선 등이 이뤄졌다.
또, next/link
가 항상 <a>
로 감싸지도록 하는 기능을 opt-in으로 도입할 수 있게 됐다.
Deno로 작성된 웹 프레임워크 Fresh 1.0이 공개됐다.
Fresh는 Preact(JSX)를 사용해 UI를 만드는 식으로 서버 사이드 렌더링을 수행하고, 필요 한 영역만 클라이언트 사이드 자바스크립트를 생성하는 Islands Architecture를 채택하고 있다.
Fresh는 https://deno.land/에서 이용하고 있다.
Vue 2.7가 릴리드 됐다.
Vue 2.7는 Vue 2.x의 최종 minor 업데이트가 되며 Vue 2는 약 1년 6개월 후인 2023년 말에 지원이 종료될 예정이다.
Vue 3에서의 백포트로 defineComponent()
, h()
, useSlot()
, useAttrs()
, useCssModules()
지원이 추가 됐다.
또, Vue 3와의 동작 차이에 대해서도 소개하고 있으니 관심 있는 분은 살펴보면 좋을 거 같다.
헤드라인
WebKit/standards-positions: WebKit's positions on emerging web specifications
github.com/WebKit/standards-positions
새로운 웹 표준 Proposal에 대한 WebKit 입장(position)을 공유하고 관리하는 저장소.
Blog - Next.js 12.2 | Next.js
Next.js 12.2 릴리스.
Middleware와 On-Demand ISR이 안정적(stable)인 기능으로 전환됐다.
API Route와 SSR을 Cloudflare Workers 기반 Edge에서 동작하게 하는 runtime 옵션 추가, next/image
개선, SWC 플러그인 지원, React 18 지원 개선 등이 포함됐다.
Fresh 1.0
Deno와 Preact를 사용한 웹 프레임워크인 Fresh 1.0 릴리스.
Release Notes for Safari Technology Preview 148 | WebKit
webkit.org/blog/12992/release-notes-for-safari-technology-preview-148/
Safari Technology Preview 148 릴리스.
CSS 관련해서는 :has()
의사 클래스 지원 개선, text-indent
속성에서 each-line
지원, :modal
의사 클래스 지원 등이 이뤄졌다.
이어 <link>
요소에 nonce
속성을 지원하며,
ITP에서 Cookie의 cap이 Script-Writeable Storage와 동일하게 마지막 사용자 상호 작용 후로 부터 7일, 상호 작용이 없는 경우엔 24 시간 후 제거되도록 변경됐다.
Release v6.0.0 · capricorn86/happy-dom
github.com/capricorn86/happy-dom/releases/tag/v6.0.0
Happy DOM v6.0.0 릴리스.
여러개의 window 인스턴스를 활용할 때 발생하던 문제 수정, Document.createRange()
/ Document.getSelection()
, Text.splitText()
지원 등.
Date and Time Pickers for All – React Spectrum Blog
react-spectrum.adobe.com/blog/date-and-time-pickers-for-all.html
React Aria와 React Spectrum에서 날짜 입력 UI를 지원한다.
접근성, 국제화, 사용자 정의 편의성 등을 제공하는 날짜 입력 필드 / 캘린더 UI 컴포넌트를 제공.
또, 다중 캘린더 시스템과 로케일을 지원하는 날짜 라이브러리도 함께 공개했다.
Release v1.23.0 · microsoft/playwright
github.com/microsoft/playwright/releases/tag/v1.23.0
playwright v1.23.0 릴리스.
har 파일을 사용한 Network Replay 기능 추가, <select multiple>
에 대응하는 toHavevalues()
추가, 텍스트 매치 시 사용할 수 있는 ignoreCase
옵션 추가 등.
Release 4.0.0 · prisma/prisma
github.com/prisma/prisma/releases/tag/4.0.0
Prisma 4.0.0 릴리스
extendedIndexes
/ filterJson
/ improvedQueryRaw
를 GA(General Availability)로 이동.
Node.js 12 지원 종료, DbNull
/ JsonNull
/ AnyNull
을 object 타입으로 변경.
statement cache size의 기본 값 변경.
Release v7.4.0 · pnpm/pnpm
github.com/pnpm/pnpm/releases/tag/v7.4.0
pnpm v7.4.0 릴리스.
의존 패키지에 patch 파일을 덧댈 수 있는 patchedDependencies
필드와 pnpm patch
명령어 추가.
production 의존만 설치하고 디플로이 용으로 복사하는 pnpm deploy
명령어 추가 등.
Vue 2.7 "Naruto" Released | The Vue Point
blog.vuejs.org/posts/vue-2-7-naruto.html
Vue 2.7 릴리스.
Vue 2.x의 마지막 minor 업데이트이며, Vue 2는 약 1년 6개월 후인 2023년 말에 지원이 종료될 예정.
아티클
브라우저, Node, Cloudflare 에서도 동작하는 Deno 모듈 개발하기(일본어)
zenn.dev/dajiaji/articles/c5340c38d11d4d
Deno 용 코드를 기반으로 하며, dnt를 사용해 Node.js 용 패키지를 생성, Cloudflare Workers에서 동작 하는지 테스트 할 수 있는 패키지 개발 방식 소개.
jest로 DB 있는 테스트를 고속화하기 | kohsweblog
blog.koh.dev/2022-07-02-jest-speedup/
Jest로 개선한 테스트 성능을 주제로 한 글.
로컬 에서는 maxWorkers, CI는 shard를 사용해 테스트를 병렬로 실행하는 것으로 시행 시간을 단축 하는 방법을 소개한다.
세로 쓰기 HTML에 있어 문자 방향은 어떻게 정해지는가 - 드완고 교육 서비스 개발자 블로그
blog.nnn.dev/entry/2022/07/01/180000
세로 쓰기 HTML 표시를 주제로 한 글.
CSS의 writing-mode
과 text-orientation
로 문자 방향 다루기, 폰트와 Vertical_Orientation 별 표시 차이, 브라우저의 구현 차이 등에 대해서 이야기 한다.
사이트, 서비스, 문서
니코니코 생방송 웹 프런트엔드의 Kubernetes 마이그레이션 핸드북 2022(일본어)
dwango.github.io/nicolive-kubernetes-migration-handbook-2022/
니코니코 생방송 웹 프론트엔드를 Docker Swarm에서 Kubernetes로 이전하면서 배운 것, 느낀 것, 운용 방법, 모니터링 등을 정리하여 공개.
Kubernates 환경에서의 프런트엔드 서비스 관리 가이드 문서.
소프트웨어, 도구, 라이브러리
codemix/deprank: Use PageRank to find the most important files in your codebase.
dependency-cruiser를 사용하여 의존 그래프를 만들고 페이지 랭크를 출력하는 도구.