摘要：
上面11篇论述了主要的原理，作为最后一篇，我们主要论述单页面相比于多页面的灵活的部分，如何使用最原始的html，js，css发挥web的最大魅力。 动画，过场动画 单页面要比多页面灵活，拥有过场动画是它最直观的表现，并且页面切换不会出现白屏的现象。 在底层ReplaceProto对象中，专门设置了两 阅读全文
posted @ 2020-10-14 14:31
Stringzdq
阅读(96)
评论(0)
推荐(0)
摘要：
序 在平时中，经常会用组件来定义弹窗，因为弹窗可以用一个div元素浮在页面上。在事实上，弹窗可以简单也可以复杂，简单到只有一个标题，一个文本描述；复杂到可以和一个app一样，拥有前进后退，可以实现复杂业务逻辑。如果按照往常的思路，就会很难扩展。 在弹窗的日常使用中，主要有如下几个情况： 类似广告弹窗 阅读全文
posted @ 2020-10-14 14:30
Stringzdq
阅读(1037)
评论(0)
推荐(0)
摘要：
序 上一篇主要介绍了组件的原理，这一篇主要是举个例子，来说明组件的应用。 案例 实现一个下拉刷新组件，当用户在某个区域将手指从上面往下滑动，这个组件就会出现，然后页面执行刷新操作。等刷新完，这个组件就会消失。 我们定义一个对象，放在组件配置数组中，在需要用到的时候加载，在/public/index. 阅读全文
posted @ 2020-10-14 14:29
Stringzdq
阅读(94)
评论(0)
推荐(0)
摘要：
序 在以往的日常前端开发中，使用最原始的html元素来拼凑整个页面，随着页面慢慢的复杂起来，如果还是用这种方式，就会出现以下问题： 页面使用了大量的html元素，导致页面卡顿； 维护页面困难，大量的html元素需要手动去更改； 大量的业务代码和渲染代码混杂，业务更改导致页面显示不正常，调试会浪费很多 阅读全文
posted @ 2020-10-14 14:27
Stringzdq
阅读(132)
评论(0)
推荐(0)
摘要：
序 html在前端一直被认为是最简单的，但又容易被忽略，在单页面开发中，通常被当作字符串保存在变量中，把它单纯作为一层渲染层来使用，但是，他拥有XML的结构，还拥有保存数据的功能。如果把相关的数据放在html上，而不是单独的在js中另外创建一个数据结构去存储，会大大减少js的代码量。 我非常追崇用最 阅读全文
posted @ 2020-10-14 14:25
Stringzdq
阅读(295)
评论(0)
推荐(0)
摘要：
序 在传统页面中，每个url都是和页面绑定的，即使是单页面，也应该有这种习惯。因此我们把Page对象作为不同的url，通过页面的切换来更改url。url的变换代表着用户在该应用中的探索路径，用户可以随时的后退到上一个页面，或者前进到后一个页面。从上面的history篇章中，使用浏览器的提供的api可 阅读全文
posted @ 2020-10-14 14:24
Stringzdq
阅读(122)
评论(0)
推荐(0)
摘要：
序 就好像用户看到的都是由dom表现出来的，所有的业务处理都是在Page对象中处理的。如果业务越简单，创建的Page对象数量就会越少；如果业务越复杂，那么相对而言Page对象数量就越多（或Page实例对象就会越复杂）。 Page对象主要做以下事情： 渲染页面，保证dom元素的合理安排，以及事件的处理 阅读全文
posted @ 2020-10-14 14:23
Stringzdq
阅读(646)
评论(0)
推荐(0)
摘要：
序 History处理是单页面一大难点，而且容易被开发者忽略，如果不看重这一块，做出来的项目很容易让用户觉得混乱，本人经常看到有些比较优秀的作品，在这个方面做的很一般。例如有以下细节处理: 用户进入首页，点击某个操作详情页面，在详情页面中点击进入更深的操作页面，做完后返回到首页。 这时候点击手机的后 阅读全文
posted @ 2020-10-14 14:21
Stringzdq
阅读(311)
评论(0)
推荐(0)
摘要：
序 App对象是一个核心的对象之一，它的目的是把一切业务逻辑之外的逻辑全部把它抽象出来，让业务代码集中于一个文件，这样有助于管理。假如我们把业务的处理算法分布到services文件夹中，处理业务的流程放在Page对象中。剩下的事情应该归属于App对象了： 文件管理，按需加载。上一篇已经做了介绍，后续 阅读全文
posted @ 2020-10-14 14:20
Stringzdq
阅读(112)
评论(0)
推荐(0)
摘要：
序 随着web项目越来越复杂，排除掉外部引入的代码，开发的代码动辄上千过万行，甚至更多。按照最初的开发经验，我们把代码全部放在一个文件上，除了代码多以外，还有命名容易被覆盖，冲突等问题。 从管理上我们会选择把它分开若干个js，分成各种部分，每个js管理某些部分或功能。不同文件中的代码可能由不同的多个 阅读全文
posted @ 2020-10-14 14:19
Stringzdq
阅读(104)
评论(0)
推荐(0)
摘要：
序 就个人开发而言，当前的前端开发环境是一个比较混乱的状态。 用户对产品要求的提高，技术为了满足用户的需求不断的进步，引入了很多专业性的知识，然而这点却不是阻碍web开发的门槛。每个入门开发者选择web开发，是因为它具备更多专业性，更多可能性，更多包容性。 较高的门槛。学会并掌握了html，css， 阅读全文
posted @ 2020-10-14 14:18
Stringzdq
阅读(89)
评论(0)
推荐(0)
摘要：
序 上一篇提到了模块化的思想，并且引入了按需加载模块的技术。然而对于实现细节却没有讲解，因为按需加载有点复杂，如果不引入观察者模式的设计思想，就会比较难实现。 使用观察者模式，我们实现dom事件类似的注册触发，这种方式可以很好的解耦，让模块间没有依赖。我们先讨论一下观察者模式是怎么回事，我们先引入几 阅读全文
posted @ 2020-10-14 14:15
Stringzdq
阅读(171)
评论(0)
推荐(0)
浙公网安备 33010602011771号