来看看他的官网首页介绍
据说这个框架几乎是0
运行时代码,非常轻量,很多工作都在编译阶段做掉了,而且不依赖于虚拟DOM,而且是直接操作原生DOM的!怪不得会被大家拿出来疯狂讨论呢!
其实Svelte这个框架确实非常高效,起码在简单的项目里是这样的,因为它省去了虚拟DOM的diff
和patch
操作,而在复杂的项目里还有待观察(因为容易存在大量重复的代码)!
OK!既然Svelte这个框架适合简单的项目开发,那么可以考虑做几个小游戏玩玩吧~ 可以入入门,做出来的游戏也可以用于平时娱乐消遣。就不手把手带你们学习如何从0到1用Svelte开发一个小游戏了,给你们推荐几个大佬已经做出来的项目,你们可以参考学习,哈哈哈哈,当然了也可以直接打开他们做的小游戏开始玩(๑′ᴗ‵๑)I Lᵒᵛᵉᵧₒᵤ❤
一共4个小游戏!接好了!
一、弹球打砖块
第一个小游戏是大家经常在抖音小程序刷到的小游戏——弹球打砖块
游戏简介:一个小球发射出去,被小球碰到的砖块会被消除,砖块全部消除则游戏成功。若小球碰到页面底部,则游戏失败,页面底部底下有一块板,能接住弹回来小球!
用Svelte框架做出来的小游戏的样子
源码地址:https://github.com/madzadev/breakout
体验地址:https://breakout-madza.netlify.app/
二、2048
第二个小游戏就不用我多说了,2048,你们肯定都玩过的
游戏简介:你需要控制所有方块向同一个方向运动,两个相同数字方块撞在一起之后合并成为他们的和,每次操作之后会随机生成一个2或者4,最终得到一个“2048”的方块就算胜利了。
用Svelte框架做出来的小游戏的样子
源码地址:https://github.com/madzadev/2048
体验地址:https://2048-madza.netlify.app/
三、记忆游戏
第三个小游戏是一个考验记忆的小游戏,相信你们以前肯定都玩过。
游戏简介:先给你展示所有卡牌几秒钟,然后再将卡片置反,你需要点击两张相同的卡片消除掉,卡片全部消除则成功。
用Svelte框架做出来的小游戏的样子
源码地址:https://github.com/madzadev/memory-game
体验地址:https://memory-game-madza.netlify.app/
还有另一款记忆的小游戏,这里也推荐给你们玩玩吧~
体验地址:https://mriduldey.github.io/flipflop/
四、XO游戏
第四个小游戏是一个xo游戏,一看你就是冲着这个游戏来的,嘿嘿!你想啥呢?
游戏简介:双方各执一个棋子儿,一个X
,一个O
,交替下棋,三个同样的棋子儿横向或竖向或斜着连着的一方就胜利了
用Svelte框架做出来的小游戏的样子
源码地址:https://github.com/madzadev/tic-tac-toe
体验地址:https://tictactoe-madza.netlify.app/
我是零一,如果我的文章对你有帮助,请点个 赞👍🏻 支持我一下