ํ”ผ๋“œ๋กœ ๋Œ์•„๊ฐ€๊ธฐ
bQuery.js Grows Up: From Tiny jQuery Tribute to a Full-Stack Framework โ€” and a Brand New Home at bquery.js.org ๐ŸŽ‰
Dev.toDev.to
Frontend

Zero Build Step ๊ธฐ๋ฐ˜์˜ Full-Stack Framework bQuery.js ์„ค๊ณ„ ๋ถ„์„

bQuery.js Grows Up: From Tiny jQuery Tribute to a Full-Stack Framework โ€” and a Brand New Home at bquery.js.org ๐ŸŽ‰

Jonas Pfalzgraf2026๋…„ 5์›” 28์ผ9๋ถ„intermediate

AI ์š”์•ฝ

Context

ํ˜„๋Œ€ ์›น ํ”Œ๋žซํผ์˜ ๋ฐœ์ „์œผ๋กœ Browser API๊ฐ€ ์„ฑ์ˆ™ํ•ด์กŒ์œผ๋‚˜, ํ”„๋ ˆ์ž„์›Œํฌ ๋„์ž… ์‹œ ๋ณต์žกํ•œ Build Toolchain๊ณผ ๋ฌด๊ฑฐ์šด Runtime ์˜์กด์„ฑ ๋ฌธ์ œ๊ฐ€ ์ง€์†๋จ. ๊ธฐ์กด jQuery์˜ ๋‹จ์ˆœํ•จ๊ณผ ์ตœ์‹  ํ”„๋ ˆ์ž„์›Œํฌ์˜ ๊ฐ•๋ ฅํ•œ ๊ธฐ๋Šฅ์„ ๋™์‹œ์— ์ถฉ์กฑํ•˜๋Š” ์•„ํ‚คํ…์ฒ˜ ํ•„์š”์„ฑ์ด ๋Œ€๋‘๋จ.

Technical Solution

  • Zero Mandatory Build Step ์„ค๊ณ„๋ฅผ ํ†ตํ•œ <script type="module"> ์ง์ ‘ ์‚ฝ์ž… ๋ฐ ์ฆ‰์‹œ ์‹คํ–‰ ๊ตฌ์กฐ ๊ตฌํ˜„
  • ๋‹จ์ผ ์—”ํŠธ๋ฆฌ ํฌ์ธํŠธ ๊ธฐ๋ฐ˜์˜ Single Import ์ „๋žต์„ ์ ์šฉํ•˜์—ฌ CDN๊ณผ NPM ํ™˜๊ฒฝ ๊ฐ„ API ์ผ๊ด€์„ฑ ์œ ์ง€
  • ๋ชจ๋“ˆ๋ณ„ ๋ช…์‹œ์  ์—”ํŠธ๋ฆฌ ํฌ์ธํŠธ๋ฅผ ํ†ตํ•œ Real Tree-shaking ๊ตฌํ˜„์œผ๋กœ ๋ถˆํ•„์š”ํ•œ ๋ฒˆ๋“ค ํฌํ•จ ๋ฐฉ์ง€
  • Native Web Components API ๊ธฐ๋ฐ˜์˜ ์ปดํฌ๋„ŒํŠธ ์„ค๊ณ„๋กœ Virtual DOM ๋ฐ ์ „์šฉ ๋Ÿฐํƒ€์ž„ ๋ Œ๋”๋Ÿฌ ์ œ๊ฑฐ
  • Signal ๊ธฐ๋ฐ˜์˜ Reactive State ๊ด€๋ฆฌ๋ฅผ ๋„์ž…ํ•˜์—ฌ DOM ์“ฐ๊ธฐ ์ž‘์—…์„ ์ƒํƒœ ํ‘œํ˜„์‹์œผ๋กœ ์ „ํ™˜
  • Streaming SSR ๋ฐ Server Runtime์„ ๋ชจ๋“ˆํ˜•์œผ๋กœ ํ†ตํ•ฉํ•˜์—ฌ ์ ์ง„์  ๊ธฐ๋Šฅ ํ™•์žฅ ๊ตฌ์กฐ ์„ค๊ณ„

์‹ค์ฒœ ํฌ์ธํŠธ

- ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ ์„ค๊ณ„ ์‹œ ๊ธฐ๋Šฅ ํ™•์žฅ์„ฑ๊ณผ ๋ฒˆ๋“ค ํฌ๊ธฐ ๊ฐ„์˜ Trade-off๋ฅผ ํ•ด๊ฒฐํ•˜๊ธฐ ์œ„ํ•œ Explicit Entry Point ๊ตฌ์กฐ ๊ฒ€ํ†  - Virtual DOM ์—†์ด Native Web Components๋ฅผ ํ™œ์šฉํ•œ ๋Ÿฐํƒ€์ž„ ์˜ค๋ฒ„ํ—ค๋“œ ๊ฐ์†Œ ๋ฐฉ์•ˆ ๋ถ„์„ - Toolchain ์˜์กด์„ฑ์„ ์ตœ์†Œํ™”ํ•˜์—ฌ ๊ฐœ๋ฐœ์ž ์ง„์ž… ์žฅ๋ฒฝ์„ ๋‚ฎ์ถ”๋Š” Zero-config ์•„ํ‚คํ…์ฒ˜ ์ ์šฉ ๊ฐ€๋Šฅ์„ฑ ํ‰๊ฐ€

ํƒœ๊ทธ

#Full-stack Framework#Tree-shaking#Signals#SSR#Web Components
์›๋ฌธ ์ฝ๊ธฐ