TypeScript5.9 刚出就关注了,令我惊喜的是这三个变化:可扩展悬停
+悬停最大长度配置
+缓存实例
不过当时在 vscode 上摸了半天没法开启,而且 eslint 当时暂时还不支持 5.9 ,于是就回退 5.8 。
今天有时间尝试了一下,vscode 版本大于 1.103 且 TypeScript 版本大于 5.9 ,默认开启可扩展悬停,之前用过实验性配置的可以删掉这个无用配置了 "typescript.experimental.expandableHover": true
需要注意的是部分插件会阻止这个功能,vue/svelte/astro 等插件要么升到最新版要么禁用
假设有这么一个函数,指定了三个参数
function test1(option: { a: string; b: number; c: boolean }) {
console.log(option)
}
悬浮在函数名上,得到的是
function test1(option: {
a: string;
b: number;
c: boolean;
}): void
如果这个参数类型需要在其他地方使用,只能把内联类型转成接口或者类型别名
type Option = { a: string; b: number; c: boolean }
function test2(option: Option) {
console.log(option)
}
此时预览结果变成了这样
function test2(option: Option): void
想要看类型?
都非常不方便,而且类型如果经过多次封装,人工去展开类型简直是地狱般的体验。
而 5.9 的可扩展悬停就是还原了内联类型预览,不需要跑到类型定义查看里面到底有啥类型,原地就能展开。虽然有些类型我试了下并不能展开,但相比原来的四处横跳体验好了几百倍。
另外也增加了悬停长度配置项,原本出于性能考虑,typescript 给的默认值是 160 ,这导致了类型只要稍大一点悬浮框就会截断或者省略内容,并且无法调整,5.9 将这个值设置成 500 ,但我建议在 vscode 中配置更大的值以便完全展开大型复杂类型。
"js/ts.hover.maximumLength": 1000 // 个人建议至少 1000 ,我自己设置了 5000
对关注类型安全的 TypeScript 开发人员来说,zod 等类型校验框架是必不可少的,它解决了统一运行时与编译时类型的难题,将运行时检查与静态类型统一为单一可信源,可以通过校验行为生成安全的入参类型,再配合 tRPC 等远程调用,编写接口实现的本身就是在严格定义其入参与返回类型,前端只需调用接口并通过泛型复用入参与返回值类型,不需要额外定义类型却能整个链路都受到类型的制约,实现了真正有实际意义的类型安全,实现了类型即文档。但这类框架带给 typescript 的性能负担是毁灭性的,这是当前 TypeScript 项目面临的最大挑战,zod+tRPC 等框架不仅带来了类型安全,还带来了指数增长的类型实例化开销。
以我当前维护的 honojs 全栈项目举例,使用 zod+hono 自带的 RPC ,接口数量在 100 个左右,后端代码随便一改 tsserver 就得暂停 10 秒,这意味着 10 秒内我失去了代码补全、签名帮助、错误检查、悬停提示、智能补全等等 typescript 带来的益处,退化成 js 原始人,编写大型 ts 项目的人应该会深有体会。
为什么这么慢?因为 RPC 是导出整个路由类型,每个接口都有由 zod 生成的实例参数类型与 return 的返回类型,所有接口全部链接在一起,组成一个巨大无比的类型交给前端项目使用。
可惜 z.infer 实在太慢了,每一次简单的代码改动,无数个 zod 类型都要全部重新推断一遍,导致 RPC+zod 项目到了一定规模每个开发人员会被迫自动学会时间暂停。
到了这时候,就需要考虑不再由 tsserver 去实时推断类型,而是先编译后端项目,前端仅使用静态类型,但编译很难做到无痛无感,总归会对开发有影响。
typescript5.9 的 Cache Instantiations on Mappers 很大程度缓解了这个难题,以我当前项目来说,the world 从十秒变成两秒,完全能接受,切换成 ts-go 更快,可惜不稳定。
TypeScript 很好,而且在越变越好。
![]() |
1
SingeeKing 3 小时 29 分钟前 via iPhone
WebStorm:这不是基本功能吗,竟然要依赖 TS 升级才能实现吗
|
![]() |
2
isbase 3 小时 18 分钟前 via iPhone
论 jetbrains 系列 ide 的重要性
|
![]() |
3
dssxzuxc OP @SingeeKing vsc 之前也有类似的插件,但没有 typescript 原生支持的好用,特别是性能差距,我试了下展开几万行十几层的深层次嵌套类型,不会卡顿。
目前在找自定义预览框的办法,默认样式的框太小了。 |
![]() |
4
enchilada2020 3 小时 5 分钟前 via Android
大佬 NB 想学一下当前 TS 全栈项目的最佳实践 有推荐的参考资源吗 博客/项目仓库/教程都可
|
![]() |
5
shuimugan 2 小时 0 分钟前
没切 deno 前确实有 zod 类型推导延迟这个问题,webstorm 更加严重根本反应不过来类型已经变更了……
|