2024年,一个前端工程师的电脑里平均躺着17个配置文件。webpack.config.js、vite.config.ts、tsconfig.json、postcss.config.js……它们像俄罗斯套娃一样嵌套,直到某天你发现自己花了3小时调试构建工具,而实际写业务代码只用了20分钟。
bQuery.js 1.7.0选择了一种近乎叛逆的解法:把这一切删掉。
「现代版jQuery」不是怀旧,是减法
jQuery在2006年解决的问题很简单——让DOM操作不那么反人类。但后来的故事大家都熟悉:框架军备竞赛、构建工具膨胀、node_modules黑洞。React团队去年承认,新建一个项目平均需要下载200MB依赖。
bQuery的作者显然受够了。这个库把自己定位为「the jQuery for the modern web platform」,但别误会,它不是让jQuery借尸还魂。它偷走的是jQuery的灵魂:直接、顺手、零摩擦。然后往里面塞进了2024年的必需品——信号(signals)响应式、异步数据组合、原生Web Components、动画、表单处理、国际化、无障碍、拖拽、SSR。
全部模块化。全部渐进式采用。
npm包@bquery/bquery的架构像乐高:core模块管DOM操作,reactive模块管状态,component模块管组件,motion管动画,i18n管翻译。你用什么装什么,没用到的代码不会出现在打包结果里。
10行代码的暴力美学
这是bQuery官方文档里的第一个示例,我直接复制过来:
一个HTML文件,一个script标签,没有构建步骤。点击按钮,计数器递增,界面自动更新。
代码长这样:导入$(DOM选择器)、signal(响应式状态)、effect(副作用监听),三行搞定状态定义,三行搞定界面绑定,三行搞定事件处理。第10行是闭合括号。
如果你刚被某个Vite项目的config文件折磨过,这段代码的情绪价值堪比周末睡到自然醒。它甚至不需要本地安装——直接从unpkg CDN拉取,浏览器原生ES模块加载。
对比当下主流路径:create-react-app或Vite初始化、等待依赖安装、配置路由、配置状态管理、写第一个组件……bQuery把「从0到能跑」的时间从小时级压缩到分钟级。对于内部工具、营销页面、快速原型这类场景,这种效率差距是致命的。
模块化不是营销话术,是物理隔离
bQuery的npm包结构值得细品。它没用tree-shaking赌运气,而是物理上拆成独立子模块:
core模块提供$和$$,相当于现代版jQuery选择器,但返回的是原生DOM节点而非包装对象。reactive模块提供signal、computed、effect、useFetch,这套API设计明显借鉴了Solid.js和Vue的组合式API,但剥离了框架上下文。component模块提供html模板标签和component定义,底层直接调用浏览器原生的Custom Elements规范。
这种拆分意味着你可以极端瘦身。只需要操作DOM?只装core。只需要响应式状态?reactive可以独立使用。想逐步迁移遗留项目?按需引入,和现有代码和平共处。
作者显然研究过前端项目的真实痛点。2023年State of JS调查显示,「构建工具复杂度」连续三年位列开发者最不满项前三。bQuery的回应是:在某些场景下,直接取消构建工具。
谁该认真看一眼
不是所有人。如果你在做大型单页应用,需要复杂的状态共享、代码分割、服务端渲染优化,React/Vue/Svelte的生态成熟度仍是护城河。bQuery 1.7.0的SSR支持存在,但文档坦诚标注「实验性」。
但它的舒适区极其精准:营销落地页、后台管理系统、浏览器扩展、嵌入式小组件、教学演示、设计原型。这些场景的共性是「需要一点交互,但不需要整个工程体系」。
一个具体数字:bQuery的full.es.mjs完整构建版本,gzip后约12KB。作为参照,React 18 + ReactDOM的生产构建,gzip后约40KB,还没算状态管理库。
更隐蔽的优势是心智负担。新员工入职,不需要学习JSX转换规则、不需要理解hooks闭包陷阱、不需要记住useEffect依赖数组的100种死法。就是JavaScript,在浏览器里跑,调试器里看到的代码和写的一致。
这种「所见即所得」的朴素体验,在2024年反而成了稀缺品。
bQuery的GitHub仓库里有个被点了47个赞的issue,用户贴了一段迁移经历:把一个用Vue 3写的内部仪表盘,用bQuery重写,代码量减少60%,构建配置删除100%。「我的继任者终于能看懂代码了」,他写道。
如果前端开发的终极目标是交付价值,而非配置文件的排列组合——bQuery 1.7.0提出的问题是:我们究竟从什么时候开始,把手段当成了目的?
热门跟贴