您所在的位置:首页 / 知识分享

用Three.js打造酷炫3D个人网站

2023.03.11

480

4131

Three.js的3D世界 当我在Google Experiments闲逛时,我发现非常多的作品都是用three.js写的。

three.js是一个让3D网页应用开发变得简单的库。它诞生于2010年,作者是Ricardo Cabello (Mr.doob),,在github上有超过1300多的贡献者,在所有仓库中star数排行第38。
当看到Google Experiments上那些酷炫的3D效果后,我决定开始学习three.js。

(3D应用的组件结构,图片来自discoverthreejs.com)

Three.js使得在浏览器展示3D图像变得容易,它的底层是基于WebGL,它使浏览器能借助系统显卡在canvas中绘制3D画面。

WebGL自身只能绘制点(points)、线(lines)和三角形(triangles),而Three.js对WebGL进行了封装,使我们能够非常方便地创建 物体(objects), 纹理(textures), 进行 3D 计算等操作。

使用Three.js,我们将所有物体(objects)添加到场景(scene)中,然后将需要渲染的数据传递给渲染器(renderer),渲染器负责将场景在<canvas>画布上绘制出来。


什么是微前端?

微前端(Micro-Frontends)概念是2016年底提出,距今已有五年多时间的沉淀,目前在前端领域也有较为广泛地应用。微前端(Micro-Frontends)是一种类似于微服务的架构,是一种由独立交付的多个前端应用组成整体的架构风格,将前端应用分解成一些更小、更简单的能够独立开发、测试、部署的应用,而在用户看来仍然是内聚的单个产品。

微前端为什么该学?

因为微前端很火,所以我们该学,当然这是前端er不能拒绝的理由,那至少我们能看出微前端的价值,给我们在项目实践中带来什么好处呢?从微前端概念中不难看出:

  1. 微前端的最佳应用场景是B端的管理系统(巨石应用),可以做到兼容老的系统版本,同时又能集成新系统,而且不影响用户的使用。
  2. 基座应用与微应用以及微应用与微应用之间可以做到独立部署、独立配置、独立监控,互不干扰。

目前成熟的微前端框架

single-spa:一个用于前端微服务的javascript框架,社区公认的主流微前端方案,可基于它二次开发。

qiankun:基于single-spa二次封装,阿里系开源框架,可能是你见过最完善的微前端解决方案

相关新闻

解决CentOS6停止更新支持后yum源失效

2020.12.17

1580

最近CentOS 6已经停止更新支持,同时官方也把yum源删除了,目前CentOS 6系统使用yum命令安装软件包基本都是失败,因此需要更换yum源。

百度蜘蛛

2015.11.05

2885

  • 028-86040068
  •   联系我们