网易首页 > 网易号 > 正文 申请入驻

把DEV.to搬进3D图书馆后,我修bug修到崩溃

0
分享至

把DEV.to做成一个能走进去的3D图书馆,听起来是个一句话就能讲完的好点子。真正动手之后,大部分时间都花在了意料之外的崩溃上,然后一个个查明白为什么。

这不是一个主题场景里飘着几张文章卡片,而是把真实的线上目录,通过Forem API拉取,渲染成一个可以行走的档案库。有书架,有房间,有分区。真实的封面图贴在真实的书脊上。你用WASD移动,而不是滚动信息流。


整个项目一开始是氛围编程,几乎完全是为了Sanity和Dev.to的黑客松。我描述想要什么,它就出现了——电影级灯光、空间音频,还有一堆我自己都没完全想清楚的系统。

这套做法在项目小的时候很好用,直到项目大到某些东西开始以重新生成一段回复根本修不好的方式崩掉。当目录变成真实的,场景要承受成千上万篇实时文章涌入,而不是十几篇模拟数据时,我就没法靠描述绕开问题了。我必须打开动画循环,追踪引用,真正搞懂底层在发生什么——不是我想这么做,而是"再试一次"不管用了。

没有可视化编辑器,一切靠数字

项目基于Next.js和Three.js,没有游戏引擎,没有可视化场景编辑器,没有任何可以拖动物体看它移动的视口。Three.js是一个用WebGL在浏览器里渲染3D图形的JavaScript库,里面的一切都是代码。没有带X/Y/Z输入框、能用方向键微调的检查面板。如果一个书架悬空了六个单位,你不能把它拖下来,只能找到设置它位置的那行代码,改数字。

听起来只是小麻烦,直到你要在一条弯曲的、程序生成的长廊里摆放几百个书架。在Unity或Unreal里,你会立刻看到错位,然后拖到正确位置。在Three.js里,你是在盲算坐标——改一个数字,等场景重建,用WASD走进去看对不对,不对就再来一遍。这个项目里每一个位置、旋转和偏移,都只是某个函数里的一个数字,不是你能看见并抓住的东西。

这也是为什么下面很多bug是关于东西在哪,而不是东西长什么样。坐标数学不像视觉样式那样容忍氛围编程——颜色稍微偏一点看着还行,但书架位置稍微偏一点,要么穿墙,要么飘在虚空里,而且你不亲自走过去看,根本不知道是哪种。

它最初不是这个项目

它一开始叫Oniria,简称Oni,是一个第一人称3D梦境日记。记忆是发光的球体,它们之间有可以实际飞行的关系连线。它长得很快:电影级灯光、空间音频、递归梦境潜入、记忆衰减,还有一个"天文台"模式,可以拉远看到全部梦境历史。等我停下来环顾四周时,已经比主分支领先197次提交、一万三千行代码,我不得不问那个显而易见的问题:这对一个黑客松来说是不是太多了?

答案没有缩小问题,而是重新定义了问题:如果继续把每个想法都当成同等重要,那范围对黑客松来说确实太大。但这不意味着Oniria本身"太多"。问题变成了产品聚焦,而不是野心。

于是我挑了一个90秒的体验,把其他一切冻结在它后面。在这个过程中,我看着自己实际做出来的东西——在一个由相互关联的事物组成的图里第一人称飞行——然后问了另一个问题:如果这跟梦境根本没关系呢?

先冒出来的是一个代码库浏览器想法(文件夹是世界,导入是走廊)。它没上线,但撬开了一点:这个引擎其实不是关于梦的,它是一种把任何相互关联、可浏览的结构变成场所的方式。于是我要了一个更奇怪的东西——把整个DEV.to网站导入引擎。字面意义上的网上冲浪。

第一个版本是一块阴谋论板

它技术上能跑。文章、个人资料、标签、搜索结果,全部同时漂浮在空间里。技术上很唬人。完全没法导航——你会出生在一团互不相关的节点云里,不知道先看哪里。

这与其说是bug,不如说是设计失败,但它定下了之后一切的基调:修复方式不是新功能,而是一个隐喻。一座图书馆。房间是主题,书架是信息流,书是文章。人有自己的房间。这一个想法对可用性的提升,超过了我此前做过的所有渲染改进,因为建筑结构能告诉你该往哪走,而漂浮的标签永远做不到。

图书馆在我站着的时候自己重新排列

当真实的DEV文章开始涌入,而不是十几篇模拟数据时,图书馆需要几百个、然后几千个书架。导航就在这时悄悄坏掉了。

原因是:书架一直在相对彼此定位。听起来合理,直到你意识到这意味着导航是布局的附带产物,而不是这个世界真正保证的东西。每当又有一页文章流入,书架位置就可能在玩家脚下移动。在普通网站上,重新渲染一个列表很无聊。在一个第一人称空间里,它能把站在里面的人直接传送走。

这就是整个项目最终依赖的那个架构决策:路径是权威的,其他一切都只是装饰路径。

一条确定性的堤道成了整个图书馆的坐标系统——一个叫archivePathPoint(bay)的函数,把逻辑上的"bay"索引转换成世界空间位置。书架、雾、天际线、能量通道、相机限制,现在全都从同一条固定路线采样,而不是各自即兴定位。

特别声明:以上内容(如有图片或视频亦包括在内)为自媒体平台“网易号”用户上传并发布,本平台仅提供信息存储服务。

Notice: The content above (including the pictures and videos if any) is uploaded and posted by a user of NetEase Hao, which is a social media platform and only provides information storage services.

相关推荐
热点推荐
玩呢?不退役了!!整个NBA都被骗了!

玩呢?不退役了!!整个NBA都被骗了!

柚子说球
2026-09-24 13:49:52
花费8亿!清退1200名中国工程师,执意去中国化的,SpaceX,如今怎样

花费8亿!清退1200名中国工程师,执意去中国化的,SpaceX,如今怎样

山谷里的怒吼
2026-09-22 11:19:25
68岁天津“跑男”陈更新去世,经常参加马拉松,好友曝原因太可惜

68岁天津“跑男”陈更新去世,经常参加马拉松,好友曝原因太可惜

青梅侃史啊
2026-09-24 07:35:29
陪睡陪玩只是开胃菜,舔手指塞拳头、集体嫖娼、背后的事藏不住了

陪睡陪玩只是开胃菜,舔手指塞拳头、集体嫖娼、背后的事藏不住了

北海史记
2026-08-12 19:57:54
四名议员施压特朗普,想恢复对台军售,鲁比奥表态,释放两大信号

四名议员施压特朗普,想恢复对台军售,鲁比奥表态,释放两大信号

DS北风
2026-09-24 14:30:03
王励勤没想到,莎莎和大头的接连落败,竟让刘国梁口碑暴涨,开始怀念他了?

王励勤没想到,莎莎和大头的接连落败,竟让刘国梁口碑暴涨,开始怀念他了?

乒乓助手
2026-07-24 01:36:03
天下无贼的原型——中国第一神偷黄瘸子黄庭利

天下无贼的原型——中国第一神偷黄瘸子黄庭利

纪史行者
2026-09-22 05:50:03
白歆惠淡出演艺圈10年「43岁近况照超狂」!定居香港⋯松口停更社群原因

白歆惠淡出演艺圈10年「43岁近况照超狂」!定居香港⋯松口停更社群原因

ETtoday星光云
2026-09-24 11:27:03
宋祖英60了,但看着就是不一样

宋祖英60了,但看着就是不一样

年代回忆
2026-08-18 22:05:19
中国富豪最多的城市不在北京、不在上海,而在这里…

中国富豪最多的城市不在北京、不在上海,而在这里…

慧翔百科
2026-09-23 08:37:26
1日狂揽15金!23日结束,金牌榜更新:中国47金霸榜 徐嘉余创历史

1日狂揽15金!23日结束,金牌榜更新:中国47金霸榜 徐嘉余创历史

大秦壁虎白话体育
2026-09-23 20:08:20
iPhone Duo难产!代工厂要求苹果二选一:要良率还是要产量

iPhone Duo难产!代工厂要求苹果二选一:要良率还是要产量

快科技
2026-09-23 16:38:17
34岁香港歌手传出死讯!死因引热议,前经纪人称太可悲,一言难尽

34岁香港歌手传出死讯!死因引热议,前经纪人称太可悲,一言难尽

感恩每一刻
2026-09-23 13:02:07
卖一台iPhoneDuo,中国收税1847,iPhone18 Pro的税是1157

卖一台iPhoneDuo,中国收税1847,iPhone18 Pro的税是1157

互联网.乱侃秀
2026-09-22 10:18:49
齐达内上任三把火:法国队改打433,姆巴佩左边锋,登贝莱副队长

齐达内上任三把火:法国队改打433,姆巴佩左边锋,登贝莱副队长

球场没跑道
2026-09-24 12:26:02
国足亚运会刚出线,没想到就传来一个噩耗,张玉宁一个举动获好评

国足亚运会刚出线,没想到就传来一个噩耗,张玉宁一个举动获好评

娱圈办事处
2026-09-23 22:47:05
国乒男团VS日本争冠!王楚钦PK松岛辉空 林诗栋大战张本智和

国乒男团VS日本争冠!王楚钦PK松岛辉空 林诗栋大战张本智和

念洲
2026-09-24 08:46:11
乌克兰模特泳池大片火了,一米七八神级身材硕士学位才是真正底气

乌克兰模特泳池大片火了,一米七八神级身材硕士学位才是真正底气

草莓解说体育
2026-09-24 04:11:01
梅毒在日本疯涨13倍,流行成疫情!年轻人却在晒“梅毒妆”?

梅毒在日本疯涨13倍,流行成疫情!年轻人却在晒“梅毒妆”?

名医在线网
2026-09-24 14:40:46
中央5台直播乒乓时间表:9月24日CCTV5转播国乒!国乒男女团冲冠

中央5台直播乒乓时间表:9月24日CCTV5转播国乒!国乒男女团冲冠

盛夏微凉
2026-09-24 03:49:07
2026-09-24 15:12:49
我是一个粉刷匠2
我是一个粉刷匠2
有态度网友ytd
267文章数 168关注度
往期回顾 全部

科技要闻

Claude在DNA里挖出新发现!大佬张锋点赞

头条要闻

媒体:特朗普亲自接机中国元首 三个细节很特别

头条要闻

媒体:特朗普亲自接机中国元首 三个细节很特别

体育要闻

巴图姆,以父之名

娱乐要闻

93岁游本昌去世 最后一句话惹人泪目

财经要闻

没了1400亿 新希望养猪的坑到底有多深?

汽车要闻

25.58万起的腾势Z9S,凭什么让我觉得值?

态度原创

艺术
教育
本地
数码
公开课

艺术要闻

宝安福永地标【怀德城·万利中心总部商务区】

教育要闻

重复与挣扎,是普娃学习不可替代的过程

本地新闻

中秋逛白塔寺,体验国医妙荟雅集

数码要闻

英特尔LGA1954插槽部件曝光,关联Nova Lake-S处理器

公开课

李玫瑾:为什么性格比能力更重要?

无障碍浏览 进入关怀版