存档

‘AJAX’ 分类的存档

yslow 2.0预览

2009年3月25日 没有评论

在slideshare 上下文档的时候,无意看到了一个yslow 2.0的预览介绍,在08年底的csdn 大会上,由yahoo工程师Stoyan stefanov 做的演讲.


这个图片很牛

如果做web 没听过yahoo 的黄金34条优化法则,那你就火星了,而基于黄金34 法则其中比较重要的13 条法则,yahoo 开发了yslow.
yslow 1.0.2 在09 年才二月发布.而这次公布的2.0预览版最乐观估计也要到明年才能发布.

1.0 主要功能
预定义的支持13个rule,所有rule都是预定义的级别和分数.像是其中的http request 就是rule 1. 分数也占得最多.而且里面基本都不能定制,所有的规则都是以Yahoo的最佳实践为标准,不考虑个性化需求.

2.0 的目标
可扩展性, 能够添加进自己定义的规则
可定制性,能够自己定义rule 的级别和所在权重.
接受社区捐献.
多浏览器支持.(它们是把这个做成纯js的吗?)

可能会出现的功能,因为现在yslow 2.0还只是在讨论阶段,所以有很多功能都只是”预览版”:

  1. 定制化的rule set pool

    yahoo 的黄金34法则肯定要全部都上,而且你还可以自己开发自己的rule , 只要实现一个javascript 函数即可, 级别,分数都自己定.

  2. 阅读全文…

分类: AJAX 标签:

一个 js 提高性能小技巧

2008年12月31日 没有评论

当我们在程序中使用循环的时候, 无论任何编程语言,把要经常用的变量进行赋值,在循环中会取得一定的性能提升,下面是一个例子, 使用的jquery.

var cached = $('.someElement');
cached.addClass('cached-element');

 

 

console.time('test');
for (i = 0; i < 1000; i++) {
$('.the').text(i + ' ');
}
console.timeEnd('test');
// ~260ms
console.time('test2');
var the = $('.the');
for (i = 0; i < 1000; i++) {
the.text(i + ' ');
}
console.timeEnd('test2');
// ~30ms

使用了firebug 的api 进行计时. javascript 性能运算firebug api 计时很常见.

这个技巧适用于任何编程语言.

 

参考资料

http://jquery-howto.blogspot.com/2008/12/caching-in-jquery.html

他的标题有点费解,不过这种tip 还是非常管用的.

分类: AJAX 标签:

使用gwt 开发ajax 应用程序

2008年12月14日 没有评论

如果你使用eclipse IDE 开发gwt 应用程序,那么最好同时使用cypal 这个gwt 的eclipse 插件.

安装cypal

  http://code.google.com/p/cypal-studio/  下载cypal ,  你的eclipse 至少要是JEE 的开发环境, 它至少需要WTP 这个插件.   如果你是在3.4 下, 你可以直接把所有jar文件放在dropins 目录下, 或者在dropins 目录下建立Cypal/plugins 目录,然后把jar 文件放在下面, 如果第一次启动你在windows / preference 里面没有看到cypal 的设置, 你可以在命令行下用eclipse.exe clean 清理一下, 应该就能看到了.装好了cypal 之后在windows / preference 里面设置一下cypal , 指定gwt home .到你解压的gwt 目录.

 

创建GWT 程序

新建一个Dynamic Web Project , 在向导里面, dynamic web module version 选2.4 , 下面的configuration 里面就可以选到Cypal Studio for GWT , 选其他的dynamic web module version 不行(2.2 的话用的时gwt jdk1.4 的).  target runtime 可以不选, 也可以指定一个tomcat 或其他容器.

firstgwt10

 

创建一个GWT module .

创建好了project 之后 , 再新建一个GWT Module. 比如叫HelloGwt , 它当然要实现EntryPoint ,

package mypackage.client;

import com.google.gwt.core.client.EntryPoint;
import com.google.gwt.user.client.Window;
import com.google.gwt.user.client.ui.Button;
import com.google.gwt.user.client.ui.ClickListener;
import com.google.gwt.user.client.ui.Label;
import com.google.gwt.user.client.ui.RootPanel;
import com.google.gwt.user.client.ui.Widget;

public class HelloGwt implements EntryPoint {

	public void onModuleLoad() {
		Label label = new Label("Hello GWT !!!");
		Button button = new Button("Say something");
		button.addClickListener(new ClickListener() {
			public void onClick(Widget sender) {
				Window.alert("Hello, again");
			}
		});

		RootPanel.get().add(label);
		RootPanel.get().add(button);
	}
}
firstgwt20 

firstgwt30

运行GWT 程序

你可以点击你的项目,然后Run -> Run Configurations , 然后选择 GWT Hosted Mode Application , 选择Project 和 Module 之后运行

或者你也可以右键点<module>.gwt.xml 文件, 对于这个项目来说就是 hello.gwt.xml 文件, 然后选择GWT Hosted Mode Application , 它会直接运行.

 

GWT 项目文件结构

创建一个GWT项目后,它的文件结构一般如下:

1. Module descriptor , 描述你的应用程序的EntryPoint

2. Public resources , 放HTML ,JS , CSS , image文件的地方

3. Source Code,  放你的Java 代码的地方

 

导入GWT 自带的示例

从cypal 里面可以导入gwt 自带的那几个示例项目. 在创建好的gwt 项目里面,点击New -> Example -> GWT Example , 然后在Sample 里面可以选择GWT 自带的那几个示例.

 

部署到其他容器

跟其他Web Project 一样, 部署到其他容器, 只需要在Server 里面添加一个新的runtime server . 然后选择你的GWT 项目,然后运行Run As –> Run on Server . 就可以了

 

打包成War 文件

你可以选择 File->Export->Export as war 将你的项目打包成War 文件以方便部署, 它其实就是把你的build/gwtOutput 下的文件打包 (这个位置是在Preference 里面设置的),

 

参考资料:

1 . http://www.vogella.de/articles/GWT/article.html

 

2 . http://www.cypal.in/studiodocs  

    cypal 的使用说明

3. http://www.ibm.com/developerworks/cn/opensource/os-eclipse-ajaxcypal/

    IBM 上一篇使用cypal 的文章,有点老了.

分类: AJAX, GWT 标签: , , ,

GWT 1.6 的新功能

2008年12月12日 没有评论

将在2009 年Q1 发布的GWT 1.6 将带来一些新的功能,有些功能还在讨论中,有些已经可以确定了.

 

  • 新的编译文件部署结构
    • 更容易的编译成war 形式. 让你可以更容易在标准的servlet 容器里部署
  • 默认的hosted mode 的容器从tomcat 转向jetty
    • 相信不用解释原因吧
  • 统一的event handler
    • 新的event handler 将会实现统一的格式,对所有widgets 都一致的格式,监听器会有重复.
  • 新的组件DatePicker , LazyPanel
  • 字符串性能提升
    • StringBuilder 使用延迟绑定提高字符串添加浏览器
  • 编译性能提升
    • GWT 1.6 将会引进新的并行编译, 现在的GWT 编译其实消耗的内存还是比较大的.

 

 

在1.6 之后还在讨论的新功能

  • Developer Guided Code splitting
    • Developer guided code splitting is a mechanism that allows developers to specify asynchronous split points in their code where the code base can be split and downloaded in different chunks. This is currently an R&D project but looks promising.
  • Analysis of compiled code, aka Story of your compile (SOYC)
    • Aims to give developers concrete information about their compiled JavaScript, such as which Java classes are generating the most JavaScript code.
  • In-browser hosted mode, aka Out-of-process Hosted Mode (OOPHM)
    • In-browser hosted mode will allow GWT developers to debug their apps within a browser rather than GWT’s hosted mode browser
  • UI Binder
    • The UI Binder will allow the creation of UI elements in a declarative fashion. Watch for UI Binder to land in the GWT incubator soon.
  • Client Bundle
    • Client Bundle implements the power of deferred binding used in Image Bundle in a generic fashion so that it can be used on many resources. These include TextResource, ImageResource, and CSSResource
  • RPC performance improvements
    • Ongoing work to improve the performance of RPC
分类: AJAX, GWT 标签: