V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
爱意满满的作品展示区。
zzhbbdbbd
V2EX  ›  分享创造

我用 Rust 写了个 WASM Blog

  •  1
     
  •   zzhbbdbbd ·
    mistricky · 2022-06-11 16:41:18 +08:00 · 3199 次点击
    这是一个创建于 898 天前的主题,其中的信息可能已经有所发展或是发生改变。

    (部署在 Vercel ,国内节点可能有点稀缺,挂上梯子访问更加喔)

    上线没有多久,也欢迎各位 V 友像素眼勘查 bug

    https://github.com/zzhack-stack/zzhack/issues

    也欢迎各位 V 友交流技术心得,换友链的原贴在这里

    47 条回复    2022-06-24 14:57:44 +08:00
    d29107d
        1
    d29107d  
       2022-06-11 17:11:21 +08:00 via Android
    牛逼
    wsph123
        2
    wsph123  
       2022-06-11 17:12:55 +08:00 via iPhone
    妙啊
    jazzg62
        3
    jazzg62  
       2022-06-11 17:14:50 +08:00   ❤️ 1
    感觉好顺畅啊,如果能再多点动画就更好了。然后不知道是不是我显示器色域的问题,我看你的文章字体有点太暗了,累眼睛
    zzhbbdbbd
        4
    zzhbbdbbd  
    OP
       2022-06-11 17:23:15 +08:00
    @jazzg62 动画后面会慢慢完善 :D
    zzhbbdbbd
        5
    zzhbbdbbd  
    OP
       2022-06-11 17:23:50 +08:00
    @jazzg62 第一次自己设计 UI ,所以有些地方设计的颜色啊啥的确实不太好,后面我再改一下
    jazzg62
        6
    jazzg62  
       2022-06-11 17:29:53 +08:00   ❤️ 1
    @zzhbbdbbd 哈哈,我先 star 了
    zzhbbdbbd
        7
    zzhbbdbbd  
    OP
       2022-06-11 17:33:46 +08:00
    @jazzg62 thxxxxxxxx
    weimo383
        8
    weimo383  
       2022-06-11 17:55:32 +08:00
    不要用绿色,感觉 vuepress 一样,太单调
    lscho
        9
    lscho  
       2022-06-11 17:56:38 +08:00
    @jazzg62 进去第一眼就发现这个问题了,感觉是背景色与字体颜色对比度不够高,看字体比较累
    kele999
        10
    kele999  
       2022-06-11 18:03:16 +08:00
    zzhbbdbbd
        11
    zzhbbdbbd  
    OP
       2022-06-11 18:11:04 +08:00
    @lscho 看起来比较严重,我再看看有没有其他合适的颜色
    wzzzx
        12
    wzzzx  
       2022-06-11 18:15:58 +08:00
    挺好看的,很棒!
    zzhbbdbbd
        13
    zzhbbdbbd  
    OP
       2022-06-11 18:22:53 +08:00
    @wzzzx thx ,也是第一次画 UI ,还有很多地方需要改进
    none
        14
    none  
       2022-06-11 18:38:03 +08:00
    看了下网页源码,这是一次性把多个网页的内容加载到本地了吗? 如果这样的话,感觉对搜索引擎收录不友好,适合做后台应用
    zzhbbdbbd
        15
    zzhbbdbbd  
    OP
       2022-06-11 18:47:09 +08:00
    @none SEO 应该还好吧,是纯静态应用,在 compile-time 通过 CLI 把所有 markdown 的文章都一起打进 wasm 包里了,比较影响 SEO 的应该是这个应用是个 SPA ,但现在搜索引擎爬虫对 SPA 的支持应该不错了
    Leviathann
        16
    Leviathann  
       2022-06-11 19:18:12 +08:00
    yew 是 react 那种响应式模型吗?半自动响应式 + vdom ,整的闭包得一层套一层,useEffect 还不够又来个 useEvent
    react 搞成这样是历史原因,如果是新的框架建议只考虑类似 solidjs 的
    codingBug
        17
    codingBug  
       2022-06-11 22:56:22 +08:00
    我怎么觉得访问速度有点慢啊
    zzhbbdbbd
        18
    zzhbbdbbd  
    OP
       2022-06-11 23:08:29 +08:00
    需要挂梯子🪜
    AEDaydreamer
        19
    AEDaydreamer  
       2022-06-12 02:03:14 +08:00
    请问你 UI 的学习过程是什么样的啊?我一直只会模仿同类 UI 照抄。
    zzhbbdbbd
        20
    zzhbbdbbd  
    OP
       2022-06-12 12:19:01 +08:00 via iPhone
    @AEDaydreamer 我也没有学习方法,我连 UI 的设计方法也没学明白,只是觉得怎样好看怎样设计了😂
    bs10081
        21
    bs10081  
       2022-06-12 14:13:49 +08:00   ❤️ 1
    不知道為啥,在 macOS 上 Edge 沒辦法加載畫面,Safari 和 Chrome 則正常

    網頁很流暢,速度很快!
    zzhbbdbbd
        22
    zzhbbdbbd  
    OP
       2022-06-12 14:30:05 +08:00
    @bs10081 可能跟 wasm 的支持有关,这个网站是一个 wasm 应用,渲染计算是 wasm 来做的,只有跟 DOM 有关( commit 部分)的部分是 js
    codehz
        23
    codehz  
       2022-06-12 15:54:57 +08:00
    (看标题我还以为是说在 rust 里用 webgl/webgpu 渲染画面呢(
    个人认为这里应该没啥性能优势——有的话就是原本 js 做的太烂(主要是 wasm 传输文本内容方面涉及多次复制,加上这部分本来也不会加速多少)
    zzhbbdbbd
        24
    zzhbbdbbd  
    OP
       2022-06-12 16:11:10 +08:00
    @codehz 如果不遇到瓶颈业务(计算密集),比如高帧刷新动画,复杂渲染交互等,是没有多少性能优势的,至少从用户体验上是感受不到的。用 rust 来编译 wasm 应用的目的不是这个,而是多一种可能性,原来浏览器只能跑 JS ,现在能跑第二种语言( wasm )来作为编译目标了,这是好玩的,是值得探索的。

    所以你能感受到这并不是在替代 js 的路上,而只是因为好玩,好多有趣的事情如果突然严肃起来去跟业务扯上关系不就不再有趣了吗 :D
    v2defy
        25
    v2defy  
       2022-06-12 23:24:34 +08:00 via Android
    我用 dioxus 写过一个小页面,感觉还是挺好的,不知道以后会不会出现 rust 前端开发 这种职位,哈哈
    zzhbbdbbd
        26
    zzhbbdbbd  
    OP
       2022-06-13 10:27:21 +08:00
    @v2defy 🤔我觉得应该不会,但可能会出现专门解决特定问题的 wasm lib 编写的职位
    boneyao
        27
    boneyao  
       2022-06-14 13:01:13 +08:00
    自己做设计,自己开发吗?
    boneyao
        28
    boneyao  
       2022-06-14 13:02:55 +08:00
    ragnaroks
        29
    ragnaroks  
       2022-06-14 21:39:07 +08:00
    似乎没有搜索功能?
    zzhbbdbbd
        30
    zzhbbdbbd  
    OP
       2022-06-14 21:55:43 +08:00
    @ragnaroks 是的!搜索功能之前有设计但还没有时间来加上,后面会慢慢的完善起来
    ragnaroks
        31
    ragnaroks  
       2022-06-14 23:44:55 +08:00
    @zzhbbdbbd 事实上我也正在实现一个完全静态的个人网站,正好也在处理搜索这里,我的做法是用 TS 写了个前端简易数据库,和 hexo 类似,最终产生一个巨大的 database.js 导入用于全文检索
    zzhbbdbbd
        32
    zzhbbdbbd  
    OP
       2022-06-15 00:13:47 +08:00
    @ragnaroks 我的做法和你类似,我是自己写了个 CLI ,在编译时把所有 markdown 的文章文件都打进一个 rust 文件(类似你的 database.js ),但我的存储结构在内存里只是一张线性表,对外暴露 service 来对这张线性表做查询。

    ```rust
    pub static POSTS: [PostFile; 2] = [
    PostFile {
    content: include_str!("../../posts/build_blog.md"),
    modified_time: 1654609915763,
    filename: "build_blog"
    },
    PostFile {
    content: include_str!("../../posts/add_links.md"),
    modified_time: 1654855511389,
    filename: "add_links"
    },

    ];
    ```

    不过线性表对查询并不是太友好,后面准备简单处理改成 hash 好了。
    之前本想先落地到 indexedDB ,然后依赖 indexedDB 的 API 来做 CURD ,但后来想好像没啥必要。
    ragnaroks
        33
    ragnaroks  
       2022-06-15 08:08:25 +08:00
    @zzhbbdbbd 可以,百花齐放,我的站是 http://www.ragnaroks.site/ ,目前还没加上搜索和标签,最近参加完美的 CSGO 比赛有点累
    zzhbbdbbd
        34
    zzhbbdbbd  
    OP
       2022-06-15 11:11:19 +08:00
    @ragnaroks 有兴趣交换友链吗 :)
    ragnaroks
        35
    ragnaroks  
       2022-06-15 12:25:41 +08:00
    @zzhbbdbbd 可以,但是现在还没有做到友链模块,而且是内链(即首页 HTML 结构中没有),可以的话我在完善后娶你的仓库 PR
    zzhbbdbbd
        36
    zzhbbdbbd  
    OP
       2022-06-15 12:39:23 +08:00
    @ragnaroks 没问题,你也可以现在在我的 blog 上添加你的站点友链,后面你站点做了友链模块再加上我的也可以。
    Ixizi
        37
    Ixizi  
       2022-06-15 15:39:11 +08:00
    WASM 不一定要用 rust 写吧
    zzhbbdbbd
        38
    zzhbbdbbd  
    OP
       2022-06-15 15:47:01 +08:00
    @Ixizi 不一定,wasm 只是一个编译目标,任何实现了编译到 wasm 的编译的语言都可以。具体可以参见 https://webassembly.org/getting-started/developers-guide/
    aitaii
        39
    aitaii  
       2022-06-16 15:00:46 +08:00
    blog_cover.svg 咋这么大
    zzhbbdbbd
        40
    zzhbbdbbd  
    OP
       2022-06-16 15:25:10 +08:00
    @aitaii sketch 直接做完导出的没有做压缩,图片资源不会阻塞渲染,只是看到一个加载的空框框会难受一点,压缩图片,移到国内的 cdn 后面可以慢慢优化
    luojianxhlxt
        41
    luojianxhlxt  
       2022-06-16 16:25:20 +08:00
    edge 最新版本打开一个从未访问过的新网站,会“已增强安全性”,默认禁止 wasm
    zzhbbdbbd
        42
    zzhbbdbbd  
    OP
       2022-06-16 17:19:41 +08:00
    @luojianxhlxt 感谢反馈,现在 wasm 肯定还处于 unstable 的状态没有那么快要稳定
    maryshaw
        43
    maryshaw  
       2022-06-17 12:24:31 +08:00
    [FTX7-WIUa-UAMfohm.jpg]( https://postimg.cc/JDm4RV11)
    maryshaw
        44
    maryshaw  
       2022-06-17 12:31:54 +08:00
    github 被 尤雨溪 Sponsoring 了?
    shenyangno1
        45
    shenyangno1  
       2022-06-23 13:57:40 +08:00   ❤️ 1
    很漂亮我很喜欢
    WebKit
        46
    WebKit  
       2022-06-24 11:21:57 +08:00   ❤️ 1
    灰常好看,这个是参考了 ghost 的主题吗,非常奇怪,我挂了梯子打不开,不挂梯子打开很快
    zzhbbdbbd
        47
    zzhbbdbbd  
    OP
       2022-06-24 14:57:44 +08:00
    @WebKit 谢谢你的好评啊,设计没有参照其他的主题设计,都是自己设计的,如果有需要我可以开源设计稿 hhhh 。挂梯子和不挂梯子速度的快慢估计得看你挂梯子的代理服务器位置和你不挂梯子的位置对 Vercel 它自己的边缘节点的响应速度快慢了,可能你挂梯子的节点还是比较远 :D
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   3318 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 30ms · UTC 12:13 · PVG 20:13 · LAX 04:13 · JFK 07:13
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.