转:web前端真的需要mvvm吗


<!–markdown–>转自知乎的评论,对目前流行的mvc,mvp,mvvm等开发模型作了很好的阐述。个人觉得很精彩

原文出处:http://www.cnblogs.com/indream/p/3602348.html –完整有图哦

我个人认为摩尔定律是不足以让一个敲命令行的时代在几十年间转变成这种各类框架技术架构实践模式的时代,真正推动计算机形成自有的工程学体系的是还有两样东西就是:

  • 人的能力并没有变强,至少没有在同级数下变强。
  • 人类一定会物尽其用
    <p><!–more–></p>
    因为人的能力并没有“跟上”机器,所以才会出现各种模式、方法、工具等等来补足人的不足,以最大地透支机器性能。就像我前几天在闪存无聊时突然想到的一句: 架构是对客观不足的妥协,规范是对主观不足的妥协
    <P>当我们需要机器做的事情多了起来,我们就没办法在一个芯片上解决所有事情,所以才会有冯诺依曼模型、计算机架构,没办法用一台机器解决,所以才要互联网、分布式、云计算。</P>
    <P>同样,随着计算机的发展,要做的事情多了,就出现了软件的概念。当“开发”正式化,我们需求的软件就变得:功能繁杂、管理统一、多入口。</P>
    <P>真正变化的不是客观本质,而是需求。就像这里说的“软件入口”在客观上我们还是只有一个,原理上始终都只有一个启动程序、一个启动代码片段。但“软件的入口”,已经从指代Main函数变成了指代起始UI,用户已经从指代专业人士变成了指代一般消费者,先有软件的需求,才有软件的定义,而需求是在变化的。</P>
    一个软件需要比当时多几个数量级的代码:
  • 客观上我们没办法做一个能显示所有代码的显示器
  • 主观上我们没办法在超快速滚动中看清所有代码

所以我们需要添加索引、用多个文件组织代码。
<P>机器的发展和软件的需求扩大和细化,我们开始出现了用户界面(User Interface)的概念和最适合用于界面的语言——标记语言(Markup Language)。当然,ML不是为UI而生的,它只是十分适合UI,所以才和UI坠入爱河。</P>
<P>因为有了更高UI的需求,所以代码才正式被分化为描述做什么(业务逻辑)和有什么(UI)的两部分,因为我们开发时没办法在两种思维方式下同时工作,开发时的人脑是单线程的。我们所看到的同时进行UI和逻辑开发只不过是我们学会了在两种模式下快速切换,看起来像同时进行,而不是真正的同时进行。同样的情况也发生在不同的代码片段的开发中。</P>
分化的情况除了UI,还发生在方方面面,比如数据操作、UI的对象和样式分离

#事务,以及界面、数据、事件、业务
<P>在之前说到过了,当需求变得庞大,解决方案也会变得庞大;当解决方案变得庞大,就会出现细分;当出现细分,就会出现按哪种方式管理的问题。</P>
<P>软件从处理一件事务发展到了要处理许多事务,各事务间有包含、顺序、主次等等的关系,变得越来越复杂。因为数据与逻辑庞大了,所以数据与逻辑就分离了,然后事件和业务分离了。</P>
它们的关系已经在我们还理得清之前持续发展而变得更加难理得清,但在一个时间点上,它们UI的领域大致分化成这些原子:

  • 界面
  • 数据
  • 事件
  • 业务

你要细化的话会有更多繁杂的细节,但相信这么写的话争议性比较小。
<P>当一个问题出现一次的时候它是一个问题,当一个问题出现了无数次的时候它会成为历史,当一个问题将会出现无数次的时候,它将需要一个明确的定义和解决方案。</P>
<P>其中,数据的更新和界面的更新这一特殊事件的问题被放大了无数倍,因为它出现了无数次。</P>
<P>在ASP还在奋斗的时候WebForm突然到来,正如WebForm还在奋斗的时候MVC突然到来。当然,我这里讲的MVC还是最原始的MVC,因为MVC在我们还在争论的时候已经发展了许多不同分支了。</P>
<P>有一点相信大家同意的就是,我们今天讨论争论的MVC、MVP、MVVM、Code Behind等等都源自于职能分化和规划的思想与目的,MVC不是它们的开始,但是一个很好的开始。</P>
<P>相信MVC的模型大家很熟悉,也很容易找到</P>
<P>界面被分到了View,数据分到了载体Model上由Model“携带”,业务集中在Controller中,而推动业务的事件由用户与View交互,通过View向Controller发动。</P>
<P>当然,实现由很多种,每种细节上都有不同,所以我才只讲也只能讲大致的MVC。MVC的其中一个缺点便是没有明确的定义,所以不同的实现(比如Struts和http://ASP.NET MVC)细节上都是不一样的。</P>
<P>我们需要知道的是,MVC并不是像上面所说的一些事情那样是一种“必然的”结果,它是一系列必然结果问题中的一种解决方案,而且是不完美的解决方案。我们顺着推理去到一个地方很容易犯的一个错误就是认为路只有这一条而忽视其他可能性(估计这也是导致很多争斗的原因)。另外,我们在讨论一件事物不完美的时候是有一个情境的,所以请不要像“我说它色彩单一,然后你把它涂成彩色后证明我是错的”。</P>
<P>MVC的一般流程是这样的:View(界面)触发事件–》Controller(业务)处理了业务,然后触发了数据更新–》不知道谁更新了Model的数据–》Model(带着数据)回到了View–》View更新数据
这里也不多再陈述MVC的原理、实践等等,因为这就太长篇大论了。</P>

#Model-View-Presenter和一些衍生
<P>像我们之前推理的,分化是一种需求的必然结果,但却没有个一个确定的结果,比如Code Behind和Code Block的问题等等。</P>
<P>MVC顺着需求把UI相关的工作分化成了三份,这点经过实践证明无可厚非。但是它们的三角关系却被一些人认为带来了一些问题,或者应该说他们有“更好的”解决方案。</P>
<P>在只有Code Behind和Code Block的那个时候维护是很直接的,不是在同一段代码内解决就是在同一个关联的事件上解决。三角关系的问题就是维护问题。在MVC,当你有变化的时候你需要同时维护三个对象和三个交互,这显然让事情复杂化了。</P>
<P>我们之前说到,随着摩尔定律,软件的需求不断地变化和变得庞大。随着需求变得庞大的时候,需求变化也变得频繁,这是一个出现了无数次以后也将会出现无数的无数次的一个问题,所以它需要一个解决方案,哪怕它不一定能被解决。</P>

<P>对MVC的改进的思想却是一样的:切断的View和Model的联系,让View只和Presenter(原Controller)交互,减少在需求变化中需要维护的对象的数量。</P>
这种方式很符合我们的期待,因为我们倾向于:

  • 用更低的成本解决问题
  • 用更容易理解的方式解决问题

<P>许多时候并不是一种模式不好,而是因为人没办法执行,比如不容易理解,我们就会选择容易理解的方式。计算机依赖摩尔定律用数量的增长来解决问题,而人是用方式的改变来解决问题的。同样因为客观原因我们不善于维护多个对象和多个对象之间的关系,所以我们改变了,或者说简化了这种方式。</P>
<P>MVP定义了Presenter和View之间的接口,让一些可以根据已有的接口协议去各自分别独立开发,以此去解决界面需求变化频繁的问题。上面两图都有接口,不过接口的实现和使用细节不一样,不过思想上是一致的。</P>
<P>在这里要提到的是,事实上,需求变化最频繁的并不一定是最接近用户的界面,但基本可以确定的是,最接近用户的界面是因为需求变化而需要最频繁更改的。当然,如果View如果是API而不是UI,那就另说了。</P>
<P>还有一些用来“解决”MVC这项缺点的比如有:http://ASP.NET MVC的ViewBag,Cocoa的delegate。它们都为了简化数据更新的问题而存在,包括MVVM。</P>

#Model-View-ViewModel
先直接看看Model-View-ViewModel(MVVM)的图:
<P>从图上看是比MVP简单了,更不用说MVC了。个人不认为MVVM是从MVP进化而来,我只觉得这是在MVP之后出现的一种“更好的”UI模式解决方案,但是用MVP来与之对比比较容易说明问题。</P>
<P>ViewModel大致上就是MVP的Presenter和MVC的Controller了,而View和ViewModel间没有了MVP的界面接口,而是直接交互,用数据“绑定”的形式让数据更新的事件不需要开发人员手动去编写特殊用例,而是自动地双向同步。数据绑定你可以认为是Observer模式或者是Publish/Subscribe模式,原理都是为了用一种统一的集中的方式实现频繁需要被实现的数据更新问题。</P>
<P>比起MVP,MVVM不仅简化了业务与界面的依赖关系,还优化了数据频繁更新的解决方案,甚至可以说提供了一种有效的解决模式。</P>
至此,我们能理解为什么许多人认为MVVM是最好的一种模式,没有之一。但事实上,MVVM也是依赖于我们至今所讲的“特有的情境”。<P>
<P>当然,最优雅的也是第一个能作代表的实践就是Windows Presentation Foundation(WPF)了。</P>

#Web
<P>之上,我们在模式演变的推论基本上都还是基于桌面软件的,但是过去十年却是互联网的时代。实际上大部分让大家争议的并不是在桌面领域最合适的是那个,而是在Web领域的模式问题,也就是在B/S场景下的问题。</P>
<P>当软件离开单机,去到网络的时候,因为场景变了,所以原有的解决方案也变了,不过需求依然是不变的。我们依然要解决的问题是用户交互与数据更新的问题,还有维护等等的问题。</P>
<P>当场景变到Web的时候,我们发现MVVM用来做服务端是极其不适用的,至少现在是不适用的。而MVP你提都不用提。为什么呢?因为:

  • 网络资源成本过高
  • 开发成本过高
    </P>

<P>问大家一个问题,当一个网页的数据更新后,你希望更新用户看到的数据,你会怎么做?</P>
一般情况下,你会:

window.location.reload();

就算你不这么做,用户也会:

F5

<P>就像之前说的,我们会选择更直接的方式解决问题。直接刷新页面的原因是因为这样更直接,更容易解决数据更新的问题。</P>
<P>很多时候你不会愿意为了一个数据更新写一个AJAX,更别说这个AJAX要带来Loading、事件顺序处理、网络问题、异常处理等等,这就是开发成本过高。</P>
<P>另一个网络成本过高就更容易解释了,虽然宽带是基本包月的,但也不带这么用的,何况还有移动用户。更主要的原因是,在本地软件,更新数据是一个引用问题,而在网络应用上,这是一个传输问题。传输成本远高于引用成本,引用之上顶多是在本地内存中再进行一次内存拷贝。</P>
<P>这个时候,我们会更倾向于用MVC模式,因为在Web层面,我们更倾向于一次性更新数据。</P>

#Web的MVVM

<P>所有问题都不是问题,就算有问题也要解决问题。</P>
<P>为什么这个标题下突然冒出这么一句话?我想说的是,需求依旧是不变的,是推动进步的原动力。
还有我之前说过,当我们讨论或者争论一个问题的时候,问题的对象已经发生改变了,而且这次是在我们讨论这个问题之前已经发生改变了。</P>
<P>网络资源成本不断下降,相信已经不需要多提及。摩尔定律和相近的一些原理正在发挥着它应用的作用,网络带宽越来越高、相应速度越来越快。</P>
<P>如果传输因为相对成本下降而导致数据传输的成本低于开发人员拒绝客户的成本,那么它就会被实现而不是被拒绝。</P>
<P>另外还有一点就是因为技术的进步,技术的资源不断被更大规模地压榨,需求也不断地增长,那么需求始终会增长超过相对不变的开发成本的。比如jQuery的出现解决了很多问题,我们现在更多地去使用AJAX,哪怕很大一部分依然是为了解决网络资源不足的问题;我们会用更多的样式代码而用了相对更少的图片;我们不再那么依赖Flash一类的矢量图解决方案而直接录制视频。</P>
<P>至少上一节我们说到的两个导致大家选用MVC的问题都正在被解决,所以我们有理由相信未来Web不仅仅需要MVC,可能会需要MVVM或其他解决方案。至少我们能理解容易理解为什么前端会出现一些MVVM的框架,比如先驱knockout.js和AngularJs。</P>

谷歌页面性能优化神器PageSpeed Insights


<!–markdown–>#简介
PageSpeed Insights 是google公司推出的网站性能工具,他可以分析页面载入的各个方面,包括资源、网络、DOM以及时间线等等信息。我们可以通过chrome的扩展程序去获取它,也可以通过在线网址来直接检测我们的网站。
ps:在线检测貌似被墙了,goagent也检不鸟了。。

<h3>在线检测网址</h3>
https://developers.google.com/speed/pagespeed/

<h3>chrome扩展</h3>
https://chrome.google.com/webstore/detail/pagespeed-insights-by-goo/gplegfbjlmmehdoakndmohflojccocli/

#功能实测

下面先以自己的小站为例
<p><!–more–></p>
第一步,打开chrome,按f12调出开发者面板,发现会多了一个PageSpeed选项卡。
hijimo.com

第二步,点击上面中的 分析按钮,chrome就会帮我们进行分析,很快我们就可以得到优化建议。如下图所示,超级简单方面。
QQ截图20140703143839.png

寂寞的网络收藏夹


<!–markdown–>#美工类

一天看一次: https://dribbble.com/
一天看一次: https://www.behance.net/
一天看一次:http://patterntap.com/
一天看一次:http://unmatchedstyle.com/
一天看一次:http://www.awwwards.com/

老外的一个免费下载psd的网站 http://www.criticue.com/
老外的一个免费下载psd的网站 http://freepsddownload.com/
老外的一个收集html5网站设计的网站 http://html5awesome.com/
老外的一个收集html5设计的网站 http://www.1stwebdesigner.com/category/design/
2014年100个免费HTML网页模板下载使用 http://www.1stwebdesigner.com/wordpress/free-html-website-templates/
<p><!–more–></p>

12个设计精美的扁平化后台界面PSD免费下载 http://yusi123.com/2874.html
40个构建良好用户界面所需的人性化解决方案 http://yusi123.com/2626.html http://goodui.org/
12个简洁漂亮的纯CSS3进度条特效动画代码 http://viduthalai1947.github.io/loaderskit/
30个令你惊喜的视差滚动(Parallax Scrolling)效果网站 http://www.webdesignersblog.net/inspiration/30-mind-blowing-parallax-scrolling-effect-websites/
[CSS3教程]50个精彩至极的css3动画效果 http://www.1stwebdesigner.com/css/50-awesome-css3-animations/
2014年流行的25个非常精美的UI设计PSD素材免费下载 http://yusi123.com/2377.html
分享10套对设计灵感有用的图形用户界面的平面设计 http://yusi123.com/672.html
50个优秀的web配色界面分享 http://www.daqianduan.com/4743.html

#设计文章类

40个构建良好用户界面所需的人性化解决方案 http://yusi123.com/2626.html
HTML5+CSS3的响应式网页设计:自动适应屏幕宽度 http://yusi123.com/2539.html
一个非常有用的HTML5+CSS3响应式图片案例 http://www.w3cfuns.com/article-1289-1.html
小伙伴们都会惊呆的10个超炫的HTML5+CSS3效果作品 http://yusi123.com/2408.html
七个CSS3代码自动生成工具让你提升前端开发速度 http://yusi123.com/1305.html

中文网页重设与排版:http://typo.sofi.sh/

#框架类
2014 年 15 款最棒的 HTML&CSS 框架 http://www.oschina.net/news/47858/top-15-html-css-framework

一个超炫的图片灯箱:http://wowslider.com/

30个非常精美的jQuery Lightbox图片效果插件 http://yusi123.com/129.html

JS前端:http://foundation.zurb.com/index.html
JS前端:http://getbootstrap.com/
JS前端:http://purecss.io/
JS前端:http://www.polymer-project.org/

#操作系统类
15 款 Windows 的数据恢复工具 http://www.oschina.net/translate/15-data-recovery-tools-for-windows

#测试类
如何模拟超过 5 万的并发用户 http://www.oschina.net/translate/how-run-load-test-50k-concurrent-users
盘点前 10 名的免费跨浏览器测试工具 http://www.oschina.net/news/53246/free-cross-browser-testing-tools
10个免费的在线测试网页性能工具 http://yusi123.com/717.html

#图标
http://themify.me/themify-icons 官网很好玩
http://icomoon.io/ 这家伙收费, 不过可以下载jpg
http://www.flaticon.com/authors/freepik 很多的图标

#图片类资源
<h3>这里提供一些图片,漂亮的,或者是命换来的,免费去下载吧</h3>
http://picjumbo.com/
http://www.gratisography.com/
http://superfamous.com/
http://unsplash.com/
http://www.imcreator.com/free

#创意网站
http://japan.diverse.jp/

ios视频播放的一些研究


<!–markdown–>#概述
最近项目需要用到视频播放,就花了一点点时间去研究了一下,在这里分享一下小成果。
<h2>思路</h2>

  • 通过html5的vedio标签去播放,省事、方便、瘦身、兼顾了anroid平台、同时还顺带支持了直播,缺点是格式只支持ogg、MP4(264)、WebM。
  • 通过加载本地播放器去解析视频,灵活的定制界面与功能,格式什么的根本不话下,还能挑战一下性能与流量。缺点是前面说的你都得自己去实现。

<h2>技术实现</h2>
<p><!–more–></p>
<h2>html标签方式</h2>
画一个浏览器控件,加载一个uri地址,再去撒泡尿,你的视频播放器就这么做好了。
关于vedio标签:http://www.w3.org/2010/05/video/mediaevents.html
<h2>加载本地视频播放器</h2>

<h4>系统自带播放器</h4>

第一个当然是想到系统自带的播放器了,可惜格式支持比起网页方式也是可耐。(mp4、m4v格式)

<h4>开源播放器</h4>
github上有很多优秀的视频播放器,如viki之类的,可惜找了十多个都是只支持mp4的。

<h4>vlc播放器</h4>
老牌的跨平台开源播放器,一直广受好评,耐何ios不大给力,总结如下。

  1. 2.2版开始仅支持ios6.1及以后版本。

  2. 视频格式支持不错,在线播放rmvb、AVI等都支持。

  3. 播放性能要求略高,touch4各种卡、马赛克,不过与视频大小无关。

  4. ipad air 播放无压力,我没有其他测试设备了。

  5. 他的开发库有600多M,打包后有12M

  6. 官方出品的 vlc for ios app 同样存在3、4问题

#总结
最后,我们的项目还是使用了web方式,一是考虑到android方面。二是对比一下,web方式还是比较有优势的。
性能方面、使用习惯方面(如某些视频播放app在home键之后依然会有声间)、流量方面苹果都已经帮我们做了优化。
若vlc在以后能够给力的话,也是不错的一个选择。

仿QQwifi传书


<!–markdown–>#概述
前两天在弄ios的视频播放的时候,需要播放本地影片,又刚好以前作的http下载文件,在下载大文件时有一些bug.
于是这个demo就出来了。

#DEMO效果
![wififile.jpg][1]
<p><!–more–></p>

![sharebox1.png][2]

#思路

  1. ios本地架设微型ftp服务器,通过ftp传送文件
  2. ios本地架设微型http服务器,通过http文件上传搞定

最后考虑到 一些设备(我知道的有PC和某系统的)不支持或者禁止了ftp协议,而且,ftp协议在windows和mac os 下又有不同的实现,我就采用了第二种方案。最重要的是,ftp我们无法对界面进行定制,http方式的话就嘿嘿哈嘿了。

#技术拆分

  1. 一张负责上传的html页面
  2. 负责处理html请求的ios后台处理程序,主要用于向浏览器发送界面和接收浏览器发送的文件
    #具体实现
    <h3>html部分</h3>
    好吧,以前我干过一段时间,考虑到种种之后直接扒了QQ阅读的改脚本

<h3>ios服务端</h3>
后台端采用了 github上的开源项目cocoahttpserver,利用它可以很简单的就搭建起一个http服务器。剩下的我们只要处理 客户端发送到后台的请求,通过请求方式和参数来向前端发送消息或者接收文件

#DEMO文件说明

  • MainViewController 程序主界面,只是简单的起了一个http服务器,并且画了一个漂亮的界面
  • MyHTTPConnection http后台处理程序,负责接收与发送http消息
  • web 目录,html页面、脚本、CSS,呈现给客户端用户的html

demo下载地址:http://pan.baidu.com/s/1jclyA
[1]: http://hijimoimage.oss-cn-hangzhou.aliyuncs.com/usr/uploads/2014/07/2473936655.jpg
[2]: http://hijimoimage.oss-cn-hangzhou.aliyuncs.com/usr/uploads/2014/07/4241126358.png

Objective-C异常崩溃捕捉


<!–markdown–>#简述

用于在 app异常崩溃时能够捕捉错误信息,并通过保存本地或邮箱或http保存。

github:https://github.com/kaler/CrashKit
参考文章:http://www.cnblogs.com/alario/archive/2012/03/27/2419710.html ;
参考文章B:http://www.cocoachina.com/newbie/tutorial/2012/0829/4672.html ;
demo:http://pan.baidu.com/s/1kTiau8n。

github上的这个组件很棒,就是最后更新时间为 3 year ago…..
<p><!–more–></p>
所以为了让他可以正常运行花了我不少时间。

同时,顺便我又添加了一个 保存在本地(设备沙盒)的功能。
再顺便,又添加了一些新的崩溃信号,用于捕捉异常。

在查看源代码的时候,我发现了一个很好玩的函数 :signal()。

百度百科:
        sig是传递给它的唯一参数。执行了signal()调用后,进程只要接收到类型为sig的信号,不管其正在执行程序的哪一部分,就立即执行func()函数。当func()函数执行结束后,控制权返回进程被中断的那一点继续执行。

sgnal(信号,function());   注意,是接受到信号之后,不论你在干什么都会跑去先执行 function(),等这个function执行完成后,再返回原来的断点继续执行原来的代码。
signal(信号, SIG_DFL); 这是取消  sgnal(信号,function()); 设置之后再接收到 该信息,function()就不会再作出处理。

小细节:为什么要设置signal函数?
引用文章1:

言归正传。开发iOS应用,解决Crash问题始终是一个难题。Crash分为两种,一种是由EXC_BAD_ACCESS引起的,原因是访问了不属于本进程的内存地址,有可能是访问已被释放的内存;另一种是未被捕获的Objective-C异常(NSException),导致程序向自身发送了SIGABRT信号而崩溃。其实对于未捕获的Objective-C异常,我们是有办法将它记录下来的,如果日志记录得当,能够解决绝大部分崩溃的问题。这里对于UI线程与后台线程分别说明。

<h3>ios自带的</h3>

NSSetUncaughtExceptionHandler( handleRootException );
仅能捕捉后一种。 所以我们需要 signal 捕捉程序崩溃时的信息来捕捉第一种。
应该说,理论上仅仅只使用 signal 监视所有的异常信号的话就可以捕捉到所有的异常。

#下面是正题

<h3>一.使用方法</h3>

 1. 将  CrashController.h,CrahController.m,CrashLogger.h,CrashLogger.m文件添加到工程里
 2.在appDelegate 里实例化代码如下


  #ifdef DEBUG
    CrashController *crash=[CrashController sharedInstance];//1.实例化异常捕
    crash.delegate=self;//给异常捕捉设置事件委托,其实不加也没事=  - =主要是加了之后你可以在appdelegate里使用一个onCrash的事件方法,当程序崩溃的时候
//2.设置捕捉到异常信息之后,对信息的处理方式,只能设置一种,多次设置会被覆盖。
    //写到本地
    [crash sendCrashReportsToLocalXmlFile];
    //发送到邮箱
   /* [crash sendCrashReportsToEmail:@&#34;454872418@qq.com&#34;
     withViewController:self.window.rootViewController];
    */
    //发送到webservices 
    /*
     [crash sendCrashReportsToBugzScoutURL:@&#34;https://smartfulstudios.fogbugz.com/api.asp&#34;
     withUser:@&#34;.com&#34;
     password:@&#34;&#34;
     forProject:@&#34;Inbox&#34;
     withArea:@&#34;Misc&#34;];
     */
#endif 

使用方法就这么简单,用到的就只有三句代码。 其实,应该只要两句就够了。。
小细节:这里用到了单例哦,是一个很典型的单例使用教程。
小细节2:上面的#ifdebug宏,是为这段代码只有在debug的时候才会生效,因 为我还没有想好让这段代码只在测试人员 测试时生效呢
还是对普通用户也生效。
<h3>二、实例测试</h3>

上面的代码已经在程序里设置好了异常捕捉模块,下面我来写一段错误代码来测试一下代码。

NSArray * ary=[NSArray arrayWithObjects:@&#34;aadfadfadf&#34;, nil];
   DLog(@&#34;%@&#34;,[ary objectAtIndex:1]);

注:这代码是写在一个viewcontroller里的一个button里的,在appdeledate里的错误是不能被捕捉到的
定义了一个数组 ary, 然后去打印并不存在的 index 1。那么程序应该会返回一个 下标越界的 异常

运行程序 ,让他出错,程序闪退了。
这里我用的是直接把文件保存到 app沙盒里,所以需要itools 同步助手等工具,去查看 documents下面的文件。
文件在logerrr文件夹下面 = - =。
效果如下图所示。
psb.png
该xml 一共保存了 call Stack 调用栈
signal 异常信号,详细查看苹果 signal.h类,
signal name 信息名称,为了方便查看设置的对应 isgnal异常信号的名称
Title 见 callStack 第6行
jmExName 异常名称
jmExReason 异常原因

有 jmExName 和jmExReason 记录下来时优先看 这两个,但是这两个不是会100%会被记录下来的,
只有 NSSetUncaughtExceptionHandler( handleRootException ); 这一类的异常才能记录 jmExName 和jmExReason。

<h3>三、结果</h3>

通过 jmExNme 和 jmExReason可以很轻易的看出。。。 下标超了。再看callstack里。。。

第13行, 异常发生在 yltabsettingvewcontroller 类下面的 checkUpdate 方法里, 是不是很方便?

小细节:如果测试邮件的话
1.请连接网络
2.在邮箱里设置帐号
3.确认设备支寺发送邮件。

the-swift-programming-language 中文版在线阅读


<!–markdown–>#Swift 编程语言

Swift 是苹果在 WWDC 2014 上发布的一款全新的编程语言,本书译自苹果官方的 Swift 教程《The Swift Programming Language》。

翻译正在进行中,翻译完成的部分会实时同步到这里。您可以到项目首页查看当前进度。

由于是多人协同翻译,可能会有些术语或者句子翻译不太恰当,如果您在阅读过程中发现此类问题,请直接给我们提 issue 或者 pull request。翻译完成后我们会进行认真的校对,给大家提供一本高质量的 Swift 教程。
<p><!–more–></p>
如果您愿意加入进来,帮助我们进行翻译和校对,请阅读项目首页中的说明并加入QQ群:364279588,我们期待您的加入,在 Swift 的历史上留下您的足迹!

最后,非常感谢您的阅读,如果您觉得本文不错的话请分享给其他人,您的支持就是我们最大的动力!

<h3>在线阅读地址:</h3>
http://numbbbbb.github.io/the-swift-programming-language-in-chinese/

搬运自:https://github.com/numbbbbb/the-swift-programming-language-in-chinese

mac os x 存储空间释放


<!–markdown–>#1 1.OnyX
小白软件,去网上下载下来之后选择cleanning,选择清理一些系统垃圾

#1 2.Xcode缓存
这才是真大头,两个月左右就能累积10个G左右的缓存。。。。
进入文件夹 /Users/jm/Library/Developer/Xcode
清除DerivedData和Snapshots里的文件

#1 3.iphone simulater 缓存

进入文件夹 /Users/jm/Library/Application Support/iPhone Simulator
逐个删除 applications下面的文件夹

【iOS翻译】《iOS7 by Tutorials》系列:iOS7的设计精髓(上)


<!–markdown–>转自:http://www.cnblogs.com/yangfaxian/p/3702261.html
简介:

本文翻译自《iOS7 by Tutorials》一书的第一章“Designing for iOS 7”,主要从程序员角度介绍了iOS7的新设计理念,堪称神作!本文翻译仅作学习交流之用,版权归原作者所有,有删减。非专业翻译人士粗糙之处在所难免,想体会原文精髓的朋友请到Raywenderlich商店支持正版。

—————— by 葛布林大帝

关于作者:

这篇文章的原作者是Jeremy Olson,一个顶级设计师加程序大牛,多款应用位列苹果商店的前100名。虽说本文主题是界面设计,但其伟大的地方在于,它是说给程序猿听的!
<p><!–more–></p>

目录:

一、iOS7的设计不同以往

1.为什么要为iOS7重新设计?
2.iOS7的新设计原则
3.iOS7的设计关键字:聚焦
二、聚焦于功能

1.应用的定义
2.一个想做所有事的应用,什么都做不了
3.一个为想为所有人设计的应用,谁都吸引不了
三、聚焦于设计基础

1.对比度
2.重复
3.对齐
4.靠近
5.排版
四、聚焦于内容

1.删除不必要的内容
2.内容为王
五、聚焦于交互

1.魔法般的Touch
2.直接操作
3.物理仿真和动画
4.三维
5.手势和导航
6.个性
六、在App世界留下你的印记

七、最后的挑战

一、iOS7的设计不同以往

1.为什么要为iOS7重新设计?

我的团队意识到,花一些时间重新设计我们的应用以适应iOS7是一项有价值的投入。专为iOS7设计的应用将会在苹果商店如鱼得水,因为:

用户  
希望自己使用的应用适应iOS7环境
媒体
不想要看起来老旧的应用作为封面
苹果
更喜欢应用迎接他们的新设计原则

2.iOS7的新设计原则

正如许多人一样,刚开始接触iOS7时,我也很不爽它的改变:扁平化、毫无质感并且单调。但过了一段时间我开始喜欢上它,因为我发现了苹果最新的设计原则有迹可循:

新的焦点
所有的重点其实就是让你的视线聚集到内容与交互上,你不再需要总是上下扫视来寻找你需要的内容。
多样化的到来
最好的iOS7应用将不仅仅是模仿“设置”或“日历”的界面。最好的应用将使用新的设计语言作为起点,并且把他们创新到极致。就像iOS6上最好的应用一样,一旦iOS7平台成熟,将会产生大量的多样化应用.
现在让我们一起解开层层包裹,在iOS7上构建伟大的应用吧!

3.iOS7的设计关键字:聚焦

302047127208997[1].png

当我开始为iOS7设计应用时,我试图寻找一个词汇来解释所有事情,现在我将要说这个词就是:聚焦。

与很多流行的观点相反,iOS7并不是关于扁平化的设计。它包含了大量惊人的非扁平化元素,事实上iOS7的三维元素比以往任何iOS早起版本都多。相应的,iOS7其实移除让人分心的元素,以聚焦在三个关键概念上(这些概念反复被苹果用来描述他们的新设计哲学):

清晰
聚焦于基本图形设计,把目光放在功能上  
顺从
聚焦于内容  
深度
聚焦于交互  
我相信最好的iOS7应用将会用他们独特的方式阐述这三个概念。

二、聚焦于功能

伟大的应用并不是从你拿出你的速写本或打开Photoshop开始,相反的,它开始于两个问题:

谁是这个应用的用户?
这个应用解决什么问题?

1.应用的定义

一个应用的定义听起来像这样:谁是应用的使用者?这个应用解决什么问题?而我的应用里,这个定义听起来像这样:为特定用户提高效率

2.一个想做所有事的应用,什么都做不了
302049248929009[1].png

你的应用应该聚焦在一个问题上。如果你无法用一句话来描述你的应用是干嘛的,那你的应用一定是太大了,并且很难给人留下深刻印象。这使得用户疑惑你的应用具备哪些功能,并且难以与用户的朋友分享。

3.一个为想为所有人设计的应用,谁都吸引不了

让一个应用为所有人设计其实是一个陷阱。当你的应用为所有人设计,其实就是不为任何人设计。不过如果你为一个特定人群设计应用,并且让他们使用得爽的话,他们就有可能带动另一群人来使用你的应用。

三、聚焦于设计基础

自从iOS7不再强调质感的用户界面元素例如纹理、倾斜和chrome,你需要牢牢抓住图形设计的基础原则。Steven Bradley这样形容它:

“当你剥开一件事物的装饰,留下的应该是它的核心基础。很不幸的是,太多的扁平化设计仅仅聚焦在外表的扁平化上,而忽视了最基础的设计准则。”

让我们不要落入这个陷阱。虽然我不能充分满足设计的所有的基本层面,但我至少可以讲一些基本的图形设计原则,让我们开始吧!

1.对比度
302103170177528[1].png

1.1.对比度简介

对比度是两个元素之间的视觉差异,它可以通过颜色、纹理或其他元素风格来形成对比。左边的文本具有高对比度,因为文本颜色与背景颜色非常不同,这使得文本非常可见;右侧的文本与背景对比度非常低,这使得它几乎看不见。请注意你的眼睛会自动吸引到左边的框,高对比度元素的合理应用可以让你的设计大放异彩。对比度是一个非常强大的工具,但必须谨慎地使用。如果在屏幕上出现太多的高对比度元素,用户的眼睛会不知道往哪儿放。

1.2.对比度的作用

高亮
强调最重要的元素,淡化次要的元素  
秀色可餐
让整体的设计更具视觉活力  
状态
显示一个元素的状态是活动还是休眠  
可读性
确保文本易于阅读  

1.3.对比度之挑战

1.3.1.问题:

一起来看看下面的截图,显然这个用户界面是有缺陷的。但究竟错在哪里?你会怎样解决它?

记下所有你注意到的设计缺陷(提示:它没有使用对比!),接着看看下面有注解的版本:
302103451278849[1].png

1.3.2.注解版本

302104369703288[1].png

1.3.3.修改版本

啊哈!现在界面看起来好多了!这些新的设计更加美观、专业并且更具功能性。
302106520335018[1].png

2.重复

302107285177829[1].png

2.1.重复简介

重复听起来像这样:同一个对象或样式重演。如果两个元素有联系,他们应该有着相似的视觉风格。缺乏重复的UI看起来很奇怪,因为人类使用模式思维来感知世界。

2.2.重复之挑战

2.2.1.问题:

再一次,看看下面的屏幕截图。对,它看起来不专业,但是为什么呢?和以前一样,记下任何你的发现(提示:它有很多元素需要重复!)
302108289867704[1].png

2.2.2.注解版本:

2.2.3.修改版本:恰当地使用重复,使这个应用更容易直观呈现所需的信息

3.对齐

3.1.对齐简介

对齐是关于视觉对象相互连接的方式。任何程序员应该好好学习对齐,因为定位错误是程序员实现设计时最容易犯错的地方之一。对应的基本思路是,不应在屏幕上任意摆放元素,每一个元素应至少与其他一个元素连接。这可能意味着两件事情:

边缘对齐
沿着边缘线垂直或者水平对齐  
居中对齐
居中垂直或水平对齐  

3.2.对齐之挑战

3.2.1.问题:来看看下面的截图,看你是否能找出对齐的问题

3.2.2.注解版本:从远处看,下面的屏幕看起来还好。但如果你仔细观察,你会发现,对准误差使画面看起来蓬乱和业余。看下图的对齐线:

3.2.3.修改版本:红色的线表示水平对齐方式,屏幕上的元素没有精确对准的任何其他元素,造成对齐线的杂乱。对齐线是非常有用的工具,利用它调整一下界面,看,更少的对齐线代表元素的整齐,这让用户的眼睛更加舒服:

4.靠近

4.1.靠近简介

靠近指的是,如果一些元素是相关的,他们应该靠在一起。如果两个元素没有关系,他们应该远离对方。开发者往往希望最大化利用屏幕,最好每个像素都塞满东西。虽然这可能是有效的,但也产生了一个混乱的布局。留白,这是你组织元素时最强大的工具,它能帮助你的用户毫不费力的理解各内容的意义。

4.2.靠近之挑战

4.2.1.问题:看看你能不能找出下图的靠近问题

4.2.2.注释版本

4.2.3.修改版本:很明显,无关的元素不当靠近,会使元素之间的关系非常混乱。你将如何解决这些问题?下面是我的一个解决方案,但总有很多不同的方式来解决设计问题。当一切都正确组合时,应用中各元素的功能将更加清晰!

5.排版

5.1.排版原则

下面是排版时要考虑的一些通用规则:

5.1.1.最多使用三种字体
这包括不同字体和同一字体内风格的组合,如字体、颜色、大小、以及粗体和斜体修饰符的组合。太多的字体会打乱你的布局一致性。  
5.1.2.有节制地使用文字居中
有时候,你绝对需要居中的文本,如导航栏标题,但经验告诉我们最好尽可能避免使用它。左或右对齐的文本布局通常显得更加专业。  
5.1.3.保持你的字体简单
增强文本易读性。  
5.1.4.提前测试字体大小
iOS7提供用户修改字体大小的选项。一定要提前在你的应用上测试所有能选择的字体大小,使之看起来都一样的舒适。  
5.1.5.使用差异较大的字体来区分内容
同一屏幕上尽量少用相似的字体,那会让用户分不清它们的区别。应用差异较大的字体,让用户轻易分辨出它们内容的不同。  
5.1.6.使用同一字体的风格变换
灵活运用字体颜色、大小、以及粗体和斜体修饰符的组合,用以突出一些重要的内容。  
这么多条要记住可能不容易,其实你只需要记住最关键的一条:让用户界面保持一致。如果应用界面看起来不够舒适,那排版一定出了什么问题。

5.2.排版之挑战

5.2.1.问题:下面的排版出了什么问题?

5.2.2.注释版本

5.2.3.修改版本

这个程序已经变得更漂亮、更实用,而你所做的仅仅是改变字体。

此时,您已经了解五个基本设计:对比、重复、对齐、接近和排版。记住,在iOS7里,注重基础设计原则是非常重要的。另外推荐一本设计类的书《The Non- Designers Design》by Robin Williams