V2EX 06月22日 17:17
[分享创造] 论坛项目 GooseForum v0.0.3 成功迭代~~(p1:欢迎大家提意见)(p2:Tailwindcss 初体验)
index_new5.html
../../../zaker_core/zaker_tpl_static/wap/tpl_guoji1.html

 

GooseForum v0.0.3 版本带来了显著的改进,包括页面重构、Markdown渲染/样式更改以及功能逻辑优化。前端采用Vite和Tailwind CSS重构,提升了开发效率、页面美观度,并保持了SEO友好性。Markdown渲染方面,统一采用markdown-it和goldmark,结合@tailwindcss/typography插件,确保了前端编辑与服务端渲染的一致性。此外,还优化了初始化账号逻辑和统计逻辑,提升了性能和用户体验。欢迎体验新版本!

🎨 页面重构:前端使用Vite + Tailwind CSS进行重构,提升开发效率和页面美观度,同时保持服务端渲染以实现SEO友好性,并支持与新库和AI的结合。

📝 Markdown渲染/样式更改:统一采用markdown-it(js) 和 goldmark(go) 处理Markdown,结合tailwindcss/typography插件,确保前端编辑与服务端渲染的一致性,并支持mermaid图表。

⚙️ 功能逻辑优化:更改了初始化账号逻辑,首个注册用户设为管理员,并优化了统计逻辑,提升了在SQLite WAL模式下的性能体验。

GooseForum v0.0.3 版本发布 (图在文末)

访问地址如下:

改动点如下

一 页面重构 (开发起来比原来快,页面比原来好看)

前端使用 vite + tailwindcss 重构。一是为了保持服务端选染衣达到 seo 友好的目的,二是 tailwindcss+vite 确实可以和当前项目比较友好的结合。并且最终打包出来的资源也是相对小巧的。并且这个过程中,体验到了一些比较新的库和 ai 的结合 。比如 rule 比如 context7 ,可以查找最新的文档并正确使用对应的的组件。

二 markdown 渲染/样式更改

在上个小版本服务端采用 goldmark 将 markdown 转 html , 前端再加入一些样式。 发布页面是 vue + md-editor-v3 。但是两者展示的差异比较大,并且由于使用的不同库,导致主题切换的时候非常难以维护。并且不同组件的主题适配非常麻烦。

所以新的版本中 markdown 渲染 采用了都支持 CommonMark 的 markdown-it(js) 和 goldmark(go) . 采用了相同的配置,mermaid 通过前端自动发现是否需要渲染 , 同时相关样式采用 @tailwindcss/typography 来渲染。算是一个一致/性能/体验的都比较不错的方案。

老实说,为了在服务端选染,这一块之前搞得好纠结。文章发布页面换过好几次前端组件,之前发布的版本用的 md-editor-v3 ,打包后感觉比较重,而且预览样式无法做到和高度一致(不但无法高度一致而且差异不算小)。这里采用直接用 markdown-it + mermaid 进行 CommonMark 语法的转化,然后通过 tailwindcss 的 @tailwindcss/typography 插件进行美化,这样可以保证前端编辑和最终服务端选染的一致。

功能逻辑优化

1 、更改了初始化张逻辑 ,参考 cloudreve 初始化账号的方式,很巧妙。 首个注册的用户设置为管理员,注册的时候如果注册人的 id 是 1 则进行一系列额外的初始化操作。2 、优化了一些统计逻辑 , 在 sqlit wal 模式下获得不错的性能体验。

欢迎大家来尝鲜。

首页

主题切换


Fish AI Reader

Fish AI Reader

AI辅助创作,多种专业模板,深度分析,高质量内容生成。从观点提取到深度思考,FishAI为您提供全方位的创作支持。新版本引入自定义参数,让您的创作更加个性化和精准。

FishAI

FishAI

鱼阅,AI 时代的下一个智能信息助手,助你摆脱信息焦虑

联系邮箱 441953276@qq.com

相关标签

GooseForum 页面重构 Markdown渲染 功能优化
相关文章