Chrome全平台更至 22版本后，给前端调试带了几个另人兴奋的实用功能

Posted by unbug on Oct 9, 2012 in Web App | 0 comments

升级了iOS6后测试了一下给应用推广来的新特性SMART APP BANNERS .首先要在head标签添加如下meta

要注意的是content属性：app-id即是你的应用id,app-argument则用作打开应用时的URL，比如打开网易新闻对应的新闻VIEW。

测试结果是：

升级了iOS6的iOS设备，不过有点小BUG，比如new ipad中整条内容部分是居左而没居中显示，itouch4只有在对应的应用成功安装了才显示。希望这些BUG是个别机子，因为测试条件有限没有全面测试。

你想你会问，如果动态添加这条meta会是什么结果呢？先来看看：

http://www.iunbug.com/archives/2012/09/21/431.html

已经有不少前端同行抱怨iScroll4的各种问题，我个人并不赞同将这些问题归咎于iScroll4,因为iScroll4进无论是touch事件的捕获，还是使用transform来处理滚动，以及将cubic-bezier应用到transition上实现高效的平滑滚动，这些原理我们都是已知的。更多原理细节可以参看[译]手把手教你编写iOS上Mobile Web App实现Fixed Position和模拟滚动 一文。此文则来解释另一个被很多人误解为iScroll4 造成的问题，那就是内容多的页面闪动的问题。现象表现为：

1.滑动过程中，滚动区内的元素在释放手指时出现细微闪动

2.图片缩放过程中释放手指时明显闪动

3.iOS上从mobile safari打开或第三方应用内打开后，切回主屏幕再切回页面时明显闪动

4.页面初始时闪动

大致这些情况下会有闪动，在ipad2,new ipad上会明显看得出。

下面就来分析产生的原因和解决办法：

http://www.iunbug.com/archives/2012/09/19/411.html

iOS6的Mobile Safari给前端开发者带来了什么  里已经提到iOS6的mobile safari将有智能应用通知标题（Smart App Banners）的功能，意在解决mobile safari里无法检测第三方应用安装状态的，通过这个功能，可以在页面中实现应用推荐类的需求。但目前来看，要实现这个需求只能在第三方应用中实现。思路也简单，第三方应用可以通过iOS的SDK提供的接口检测到对应的应用是否已经安装，然后在内嵌的UIWebView中打开的连接时追加参数如“?isinstalled=1”之类的参数供web页面获取来判断。web获知状态后可以提示给用户觖发的对应的应用的方案，如“打开应用”，“安装应用”等。

不过我们今天来说一种不借助第三方应用在mobile safari里就能实现跟上述类似的功能。

先来看看实现代码：

http://www.iunbug.com/archives/2012/09/18/401.html

http://www.iunbug.com/archives/2012/09/18/398.html

iScroll4启用snap时原生滚动会被阻止，具体表现是拖动snap作用的元素往非snap路径时将无法拖动页面。

官方的解决办法是追加onBeforeScrollStart事件：

这种办法在测试中iOS和原生android设备是没有问题的，但第三方定制系统的设备（如小米，魅族）以及将页面在android应用中打开都会造成滑动非常的卡的现象。这时只要改改iScoll4的源码即可。具体参看

http://www.iunbug.com/archives/2012/09/18/398.html

Facebook在Mobile Web APP方面一直是担当榜样的大哥形像.近日出的新版在iOS上多了个“摇一摇”（Friendshake）寻找附近友邻功能。与这个功能相关的事件早在iOS4.2的时候就被mobile safari支持了,很早就听到做mobile游戏的朋友用上这个事件了,即是DeviceMotionEvent,下面我们就来讲讲这个事件:

DeviceMotionEvent 会在设备发生有意义的摆动(或运动)时产生.事件对象封装有产生的间距值,旋转率,和设备加速度.

加速度的计算方式是重力和用户产生的两个加速度矢量之和.设备是通过 陀螺仪和加速计来区别这两者的.

使用方法如下:http://www.iunbug.com/archives/2012/07/18/387.html 

阅读全文

http://www.iunbug.com/archives/2012/06/14/360.html

你可能听说了这个新MVC框架： CanJS。还有什么比用它来创建一个联系人Web App更能深入了解它的办法呢？当看完这三篇教程，你将全面了解用它的什么工具来创建你自己的Web App。

选择正确的库

创建一个JS APP没有好的工具是很有难度的，jQuery只是操作DOM的库，没有提供任何创建APP的基础，这就是为什么我们要一个类似CanJS的专门的库。

CanJS 是一个轻量级的MVC库，提供你创建一个JS APP所需的工具。

CanJS 是一个轻量级的MVC库，提供你创建一个JS APP所需的工具。 它提供有MVC (Model-View-Control) 模式的基本框架，模板动态绑定， route的支持且 内存安全。同时支持 jQuery, Zepto, Mootools, YUI, Dojo，有丰富的扩展和插件。

第一部分你将学到：

阅读全文

http://www.iunbug.com/archives/2012/06/14/360.html

背景概述

Google已经在Mobile Web App开发上取得了很大的突破. HTML5已经拉近了Mobile设备Native App与Web App的差距. mobile Gmail 正是Google的Fixed position的最佳实践之一. iPad上的基于两栏的Gmail也运用了这种实现机制.

桌面浏览器本身就支持 position: fixed. 但 mobile Safari在iOS5之前不支持, 我们只能定制一个模拟滚动的工具来替代原生的滚动.

本教程就是在Mobile Web App上如何实现position: fixed的,就以下几点来讲:

• 如何布局
• 通过transforms实现滚动的动画效果
• 通过 transitions实现滚动的惯性冲力
• 触摸屏幕时中止滚动,即在打断 transitions的执行

跳转看详情

http://iunbug.appspot.com/article.html?objNews.id=228001

JQUERY 1.4.4发布,修正的BUG列表好长好长...

JQUERY 1.4.4发布之后,jQuery Mobile Alpha 2 也跟进了..

My SQL 学习笔记
2008　09　29
首先:MySQL是一个小型关系型数据库管理系统，开发者为瑞典MySQL AB公司。在2008年1月16号被Sun公司收购。

(1)系统管理
1.运行CMD后用CD命令到Mysql的BIN目录下(如:E:\Program File\MySQL\MySQL Server 5.0\bin)[以下几步的操作都在此目录下执行]
2.启动MySQL服务:  net start mysql
3.连接MySQL:    mysql -h localhost(主机)　-u userName(用户)　-p databaseName(可选) (然后输入密码)
4.修改root密码:
 1)新密码不为空
  mysqladmin -u root -p password 新密码 (然后输入:旧密码)
 2)新密码为空
  mysql -u root -p (然后输入:旧密码)
   use mysql;
   update user set password=password('') where user='root';
   flush privileges;  (刷新权限.)
   quit　(退出)
 3)原密码为空
   mysql -u root -p (然后回车)
   use mysql;
   update user set password=password('新密码') where user='root';
   flush privileges;  (刷新权限.)
   quit　(退出)
(2)基本命令(注意:执行语句以";"号或"\g"结束!)
1.列出My SQL的有多少个数据库:    show databases;
2.选择某个数据库:          use databaseName;
3.列出当前数据库中的所有表:     show tables;
4.列出某个表的结构:         desc tableName;
5.显示当前数据库:          select database();
6.显示当前用户:           select user();
7.显示时间:             select now();   [按格式显示时间:select date_format(now(),'%Y-%m-%d %H:%i:%s');]
8.显示MySQL版本:          select version();

(3)MySQL实现分页的思路
所谓分页显示，也就是将数据库中的结果集人为的分成一段一段的来显示，这里需要两个初始的参数：    
   
  每页多少条记录（PageSize）？    
  当前是第几页（CurrentPageID）？    
   
  现在只要给一个结果集，就可以显示某段特定的结果出来。    
  至于其他的参数，比如：上一页（PreviousPageID）、下一页（NextPageID）、总页数（numPages）等等，都可以根据前边这几个东西得到。    
   
  以mysql数据库为例，如果要从表内截取某段内容，sql语句可以用：select   *   from   table   limit   offset,   rows。
  (offset是起始行(第一行从0开始),row是要显示的行个数)
  看看下面一组sql语句，尝试一下发现其中的规率。    
   
  前10条记录：select   *   from   table   limit   0,10    
  第11至20条记录：select   *   from   table   limit   10,10    
  第21至30条记录：select   *   from   table   limit   20,10    
  ……    
   
  这一组sql语句其实就是当PageSize=10的时候取表内每一页数据的sql语句，我们可以总结出这样一个模板：    
   
  select   *   from   table   limit   (CurrentPageID   -   1)   *   PageSize,   PageSize    
   
  拿这个模板代入对应的值和上边那一组sql语句对照一下看看是不是那么回事。  

　　随着用户的爆发量增长，在某个凌晨醒来时，你发现：数据库已死。

　　传统软件系统实则应该叫数据库软件系统，是一个数据库系统，开发这样的系统非常简单，成本 也非常低廉，只要根据需求先设计好数据表结构，然后，就找一些大学毕业生写大量SQL语句，虽然还使用 JAVA/PHP/.NET等语言，但实际上这些语言只是将SQL送往数据库执行的运输工，没有什么价值和地位。

　　所以，这样的系统运行在互联网环境下以后，主要负载就集中在数据库的SQL运行上，也就是说：整个软件系统性能关键点就集中在数据库上了，数据库是性能主角，是王者；虽然你购置了昂贵的Websphere/weblogic等应用服务器，但是由于Java只是运输工，根本起不到性能上负载分担的作用。

　　著名的社区网站MySpace就是因为一个好的idea，用户疯狂增长，但是系统却不能平滑承受增长的用户访问，这些用户访问网站缓慢、无法访问甚至丢失数据，他们经过几次伤筋动骨的架构升级，在微软SQLServer直接技术支持下， 好容易才勉强应付过去。看看他们痛苦经历，你是否也愿意再来一次呢？详细情况： http://www.jdon.com/jivejdon/thread/34601.html

　　从中可以看出，数据库性能微调和挖潜总是有限度的，对数据库性能优化提高性能的步伐永远赶不上用户增长量， 有人也提出数据库集群的概念，其实数据库集群是一个骗人概念，一般只是备份，在集群数量和failover上有制约， 否则，数据库巨头Oracle不会跑到JavaEE阵营摇旗呐喊，还最早推出EJB3服务器，并扬言要收购JavaEE过去老大 Bea Weblogic。

　　很显然，数据库成已经为软件系统的主要性能瓶颈了，单纯依靠数据库自救的方式已经行不通，是宣布数据库退出主角时候了，那么由谁来宣布：教皇数据库已死？无疑是Java。

　　Java社区早在本世纪初就提出中间件概念，用以取代数据库地位，实则就是将软件系统主要负载从数据库上转移到中间件服务器上，分担负载。 也就是说：Java社区提出：既然数据库已经成为瓶颈，修修补补也无济于事，不如放弃它，不再依赖它。

　　也就是说：Java不再做SQL的运输工，不再是跑龙套的了，而是主角，那么如何让Java成为主角呢？那必须依赖对象这个概念，对象是生活在中间件服务器内存中，它又是数据库数据的业务封装，它和数据库有着 千丝万缕的关系，但是它又和关系数据库存在天然矛盾，两者水火不容。

　　过去，我们是将业务逻辑写成SQL送往数据库执行，导致数据库成为业务逻辑主要运行瓶颈，那么，如果我们将 业务逻辑用对象概念表达，而不是SQL，那么我们的业务逻辑就围绕内存中的对象反复计算，这样，负载不是集中在 对象运行的中间件服务器上（也就是应用服务器Weblogic/websphere/JBoss/Tomcat）？而对象/中间件都是用Java 语言表达的，无疑，这样的架构，Java才成为主角。

　　再进一步想想：如果我们从软件系统开始之初，就使用对象分析设计，不与数据库沾边，整个流程就完全OO，分析设计直至代码都摆脱了数据库影响，这个流程如下：

　　分析建模 细化设计(通过Evans DDD) 架构设计 代码实现 调试测试 部署运行。

　　那么数据库在什么时候建立呢？数据库表结构的创建可以延缓到部署运行时，由Hibernate/EJB CMP/JPA等ORM技术自动实现。这样， 整个上游环节就不涉及数据库技术，而是使用更符合自然的表达OO方式，软件质量就更高了。我在J道网站已经大量阐述了如何从OO分析 到OO实现的过程，包括我的Jdon框架也直接支持这样一个自然方式。

　　现在，很多人已经理解，分析设计要用OO，但是数据库是运行阶段缺少不了的，确实，这是正确观点，我们夺取数据库的王位，不是将它打倒，只是理性和平移交权力重心而已，数据库退出主角地位，让位于Java中间件，也预示着过去数据库为王的时代的结束， 但是数据库会和操作系统一样，成为我们现代软件系统一个不可缺少重要的基础环节。

　　正是基于这样事实，虽然我早在2005年喊出“数据库时代的终结一文，回帖长达几百贴， 大部分是怀疑论，不信论，由此可见，由于传统观点影响和不及时与国际新思想同步，国内数据库保皇派还是有相当人数的。我BanQ人微言轻，抛出这些观点被保皇派讥讽为所疯话，那么看看，著名ORM框架Hibernate和SEAM框架创始人Gavin King的一段观点：

　　In almost all enterprise applications, the database is the primary bottleneck, and the least scalable tier of the runtime environment. 数据库成为了大多数企业应用的主要瓶颈，也成为了运行环境中最不具伸缩性的层。... PHP/Ruby的用户会说什么都不共享（share nothing）的架构照样具有很好的伸缩性，.... 这些傻瓜真正想的是“除了数据库以外什么都不共享(Share nothing except for the database)”的架构。更多参看这里

　　所谓伸缩性，就是弹性，整个软件架构既支持小负载运行，也支持大负载支持，只要增加服务器即可； 由于软件系统负载已经从SQL转移到内存中的对象上，那么我们就可以通过增加这些应用服务器数量，通过分布式计算甚至云计算，达到业务对象在多台应用服务器之间传递共享，而不必通过数据库这个环节，既减轻数据库负载，又能轻松扩充性能，不必走 集中试大型主机之路，只要添置低廉PC服务器即可。经过权威测试：websphere/weblogic的20台PC服务器集群性能不亚于一台SUN/IBM的中型机，性价比已经一目了然了。

　　JavaEE的服务器的集群相对于Linux等操作系统集群的好处在于：JavaEE集群能够针对某个繁忙负载大的具体业务功能进行集群，换句话说： 就是做到精确制导，精确解决问题，而显然，Linux操作系统的集群则无法直至业务核心的。

　　从另外一个方面看：虽然现在PHP号称走上对象路线，Ruby的铁轨开始铺进企业，但是他们的运行环境实则依赖数据库的， 特别是Ruby On Rails还是最适合Evans DDD对象建模路线，但是目前来讲还是"披着羊皮的狼"，批着DDD，实则是以数据库中心。当然相信 ROR等将来会提供分布式计算环境，但是JavaEE在2002年时就通过EJB以及分布式缓存成熟稳定地提供分布式计算的中间件，并且已经大量成熟应用。

　　本文结束以前，我相信大家明白，在众多语言平台竞争中，为什么Java能够击败过去拳王数据库，夺得新的拳王冠军，以及他的特点所在。有人可能会说：你忘记谈.NET了，这个不用我回答你，用微软中国董事长张亚勤的话回答：8年前.NET战略很天真， 你会将你的重要业务企业计算依赖一个很天真不成熟的技术吗？除非你自己也很天真:)。
进入原文:http://www.jdon.com/artichect/dbdead.htm

我不喜欢太个性的主题,就是因为伤眼睛,朋友问我每天对着电脑怎么不近视?我的桌面看起来整洁,颜色很让人舒服,自己电脑里有几十G的资料目录也很清晰,就像有人偶尔打开的我衣柜或抽屉会吃惊的发现衣服用具都整洁的叠放着(在大学里至少我认识的同学朋友没有一个是这样子的).这些都是为了自己,一个好习惯受益终生,深有体会.

好了,要想有如我Blog一样的效果只要选择KJC主题,然后在"通过CSS定制页面"里粘贴以下CSS代码就可以了.

 1#top
 2{}{
 3    background-color: #20375f;
 4    background-image: url( "http://www.blogjava.net/images/blogjava_net/tidelgl/33863/o_4HeaderBg.jpg" );
 5    background-position: right;
 6    height: 90px;
 7    vertical-align: middle;
 8}
 9#sub
10{}{
11    background-color: black;
12    background-image: url( "http://www.blogjava.net/images/blogjava_net/tidelgl/33863/o_12HeaderBg.jpg" );
13    color: #CCCCCC;
14    font-size: 12px;
15    padding: 4px;
16}
17
18.posthead
19{}{
20    background-color: #eeeeee;
21    background-image: url( "http://www.blogjava.net/images/blogjava_net/tidelgl/33863/o_icon-titledoc.png" );
22    background-position: 5px center;
23    background-repeat: no-repeat;
24    border-bottom: 1px solid #CCCCCC;
25    padding: 4 4 4 25;
26    color: #444444;
27    font-size: 9px;
28}
29
30
31body
32{}{
33    font-size: 13px;
34    font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
35    background-color: #D9D6CB;
36    padding-left:20px;
37    padding-right:20px;
38    padding-top:10px;
39    background-image: url("http://www.blogjava.net/images/blogjava_net/tidelgl/33863/o_7forbg.gif");    
40
41}