在前端应用的优化中,对加载资源的大小控制极其的重要,大多数时候我们能做的是在打包编译的过程对资源进行大小控制、拆分与复用。本片文章中主要是基于 webpack 打包,以 React、vue 等生态开发的单页面应用来举例说明如何从 webpack 打包的层面去处理资源以及缓存,其中主要我们需要做的是对 ...
分类:
Web程序 时间:
2017-12-14 19:33:45
阅读次数:
267
单页面应用 一个项目中只有一个完整的html页面,其他的都是部分的html片段组成。页面跳转只是局部刷新,不会重新加载全部资源。片段之间的切换快,比较容易实现转场动画。 多页面应用 一个项目是由多个完整的html页面组成,页面跳转所有的资源都要重新加载,页面之间的切换会出现卡顿空白的问题,不容易实现 ...
分类:
其他好文 时间:
2017-12-14 15:50:29
阅读次数:
148
在vue单页面应用中,我们大概都会使用CommonsChunkPlugin这个插件。 传送门 CommonsChunkPlugin 但是在项目经过本地测试没有任何问题,打包上线后却会报错 webpackJsonp is not defined。这是因为公共文件必须在自己引用的js文件之前引用。 可以 ...
分类:
Web程序 时间:
2017-12-07 16:04:39
阅读次数:
296
原文地址: "前端快速开发模版" 之前一直在开发移动端的单页面应用,而移动web对性能和效果要求是比较苛刻的,所以用的都是轻量级的框架体系。基本上是Zepto加自己开发的单页面框架,再加上若干简单的库。这样前端要加载的文件很小,修改起来也非常方便,同时这样的轻量级的体系使用gulp进行自动化管理也是 ...
分类:
其他好文 时间:
2017-11-28 10:25:45
阅读次数:
251
所谓万事开头难,本文旨在为初探React的同学,建立第一个最基本的react应用。 Create React App是Facebook官方的一个快速构建新的 React 单页面应用的脚手架工具,它可以帮你配置开发环境,以便你可以使用最新的 JavaScript 特性,还能提供很棒的开发体验,并为生产 ...
分类:
移动开发 时间:
2017-11-23 11:03:50
阅读次数:
190
Vue这个框架现在在单页面应用方面非常受人欢迎。 基于vue-cli创建的项目怎么样才能更好地处理网络请求? 首选的应该就是axios了 这次给刚接触vue的新手介绍一下axios在vue中如何使用 安装的话自己去官网看 一、不推荐的方法 这种方法比较麻瓜哪个文件要用就 import axios f ...
分类:
移动开发 时间:
2017-11-22 20:03:07
阅读次数:
308
github: https://github.com/VV-UI/VV-UI 演示地址: https://vv-ui.github.io/VV-UI/#/meta-info 1. LoadingBar 当我们访问知乎或者Github的时候,会经常看到这样的加载进度条: 这种交互对于单页面应用来说,也 ...
分类:
其他好文 时间:
2017-11-19 17:25:14
阅读次数:
157
1、数据驱动视图 <div id="app"> {{ message }} </div> var app = new Vue({ el: '#app', data: { message: 'Hello Vue!' } }) 2、组件化(单页面应用) Vue的组件引入构建工具之后有一个单文件组件概念, ...
分类:
其他好文 时间:
2017-11-11 17:47:14
阅读次数:
388
懒加载: ? 也叫延迟加载,即在需要的时候进行加载,随用随载。 为什么需要懒加载? 像vue这种单页面应用,如果没有应用懒加载,运用webpack打包后的文件将会异常的大,造成进入首页时,需要加载的内容过多,时间过长,会出啊先长时间的白屏,即使做了loading也是不利于用户体验,而运用懒加载则可以 ...
分类:
其他好文 时间:
2017-11-03 14:06:17
阅读次数:
209
概述 Vue非常适用于实践单页面应用程序也就是平时大家说的比较多的SPA(single page application),这点应该了解过Vue的应该都知道吧。一般的单页面应用是基于路由或页面之间的链接来形成的,Vue是基于路由和组件的,所以我们今天就来了解下vue-router。vue-route ...
分类:
Web程序 时间:
2017-11-01 17:02:12
阅读次数:
248