微软技术 | Nocoo.Weblog | 李征(Zheng Li)的个人博客

如何关联Silverlight和ASP.NET项目

十一 07

silverlight-host

用过Silverlight的兄弟都清楚，当在Visual Studio 2008中建立一个Silverlight Application Project时，首先会弹出一个提示框如上图，询问是否自动生成一个ASP.NET网站来托管这个Silverlight应用。默认会建立。一般情况下我们都会选择不建立，这样会在解决方案里少生成一个项目。
自动生成一个ASP.NET网站来托管这个Silverlight应用的好处是，在每次Debug整个解决方案的时候，Visual Studio 2008会自动首先编译Silverlight项目，然后把编译结果，一个xap文件，自动拷贝到ASP.NET网站项目的ClientBin下，然后启动ASP.NET网站项目的默认页面，显示了最新版本的Silverlight应用。如下图所示。

silverlight-host2

问题是，如果你一开始没有让Visual Studio 2008建立那个网站项目，如果哪天你需要一个网站了，可能是各种原因，比如需要一个本地的Web Service等等，自己新建一个ASP.NET网站，就不能实现上面的自动拷贝xap文件了。

解决方法比较绕。这是一个MSBuild问题，你需要Unload各个项目，然后用写字板打开ASP.NET的项目文件（csproj文件），然后在PropertyGroup中加一个SilverlightApplicationList项，如图：

注意相对路径，项目名称以及项目的GUID。这些东西都可以在解决方案文件（sln文件）里找到。就不详细解释了。

silverlight-host4

Reload项目之后Build，就会发现你的项目可以自动把xap文件拷贝到ClientBin下了。

后记：作为一个使用Silverlight开发了无数年的工程师，这似乎是我第一次写关于Silverlight的博文。现在想想，大概是公司政策使然？我应该是个很守规矩的人。

好吧，我承认只有我才会发现这样的小问题

九 14

nocoo开发心得, 微软技术 Silverlight 3 Comments

c-sharp-comment

public sealed class ScrollViewer : ContentControl

//
// Summary:
//     Gets a value that represents the horizontal size of the area that can be
//     scrolled; the difference between the width of the extent and the width of
//     the viewport..
//
// Returns:
//     The horizontal size of the area that can be scrolled. This property has no
//     default value.
public double ScrollableWidth { get; internal set; }

Silverlight Control里面的小细节，小小小细节…
好几篇这样的文章了，以后学着粗枝大叶一点，产品中的这些小细节太让我恼火了。

补充几句，觉得C#里面的注释写得太像八股文了。最近写了好多好多，现在随便开个东西开始无意识输出的是“Gets or sets a value indicating whether…”。

安装SP1导致的Microsoft Office Setup Assistant死循环问题

四 16

nocoo开发心得, 微软技术 Mac OS No Comments

picture-6

问题

在我的Mac OS X 10.5.6中,通过自动升级安装Microsoft Office 2008 for Mac的SP1后,再次打开任意Office程序时,都会出现一个Microsoft Office Setup Assistant:

picture-1

问题是下一步通过这个窗口后,都会弹出Mirosoft Autoupdate升级窗口:

picture-2

在这里,任何选择最终都会关闭这个窗口.然后再次点击Office的任意程序,循环重新开始上面的过程.

解决

删除这两个文件:
/Users/username/Library/Preferences/Microsoft/Office 2008/Microsoft Office 2008 settings.plist
picture-4

/Applications/Microsoft Office 2008/Office/OfficePID.plist

picture-3

删除这两个文件后,再次打开Office程序时会要求重新输入用户名,单位名和序列号,但是通过后就可以正常使用了.

6个常见的IE渲染Bug及其修复方法

四 10

nocooWeb标准化研究, 开发心得, 微软技术, 服务器和集群技术 Microsoft No Comments

ie-bug

1. size,padding和margin距离异常

在IE6中,各种size,padding和margin总是感觉怪怪的,有时候死活差那么几个像素.这时候可以使用单独为IE准备的CSS文件来纠正.只需要在页面头部加类似这样的CSS文件即可:

<!--[if IE 6]>
    <link rel="stylesheet" href="css/ie6.css" type="text/css" media="screen" />
<![EndIf]-->

其中的ie.css是对主CSS文件中,那些在IE6下显示异常的元素,重新定义的CSS.

2. 块元素居中问题

在现代浏览器中,一个块元素,假设是一个p,设置了宽度,设置左右margin都是auto之后,渲染效果应该是居中.但是在IE中,必须对其父元素,假设是body,加text-align:center;才能看到居中效果:

body { text-align: center; }

并且,你还要在子元素p里把继承的居中纠正回来:

p { text-align: left; }

3. div最小高度不能低于12px的bug

如果你需要一个高度很小的div,假设说做一个分隔线之类,你会发现div最小高度不会低于12px.这时候要设置div的line-height: 0;才行.

<div style="line-height: 0px; height: 2px;"></div>

如果还是不行,你要在div里套一个p,并且指定这个p的line-height: 0;.

<div style="height: 2px;"><p style="line-height: 0px;"></p></div>

4. 浮动元素的双倍margin距离bug

这是一个非常严重的bug.你会发现你的侧边栏总会跑到第二行去显示,或者明明你计算好宽度,平分两半,还预留了些空隙,在Firefox显示正常,在屏幕左右分布的两个块元素,在IE下非换行不可.说起来应当是IE的float块元素,margin加倍渲染的bug.
这样的代码:

.floatbox {
   float: left;
   width: 150px;
   height: 150px;
   margin: 5px 0 5px 100px;
   /*This last value applies the 100px left margin */
}

正确的渲染应该是这样:

marg-norm

但是在IE5和IE6里,margin的100px被加倍,渲染成这个样子:

marg-doubled

margin被加倍成了200px.
浮动元素的双倍margin距离bug的出现条件和特点是:

float块元素
margin方向与float方向相同,即float: left;的块只会加倍margin-left的值.
这个float块与其父容器的内边之间夹着这个margin的情况下,才会加倍.当前行的第二个float块,因为其左边不是父容器的内边,就不会出现这个bug.
浮动元素的双倍margin距离bug具备左右对称性.

修复很简单,在所有float的元素的CSS中加入display: inline;即可.其实根据W3C对float的定义,当float具备left或者right时,display效果应当是不起作用的,除非是display: none;,但是指定了display: inline;确实让IE6正确显示了margin.

5. 盒模型的bug

看这样一段代码:

div#box {
   width: 100px;
   border: 2px solid black;
   padding: 10px;
}

根据盒模型定义,这个div的宽度应该是2+10+100+10+2=124px.大部分浏览器也是这样解析的,唯独IE6认为它是100px宽.
这个bug会对布局带来严重影响.消除这个bug只需要在页首制定DTD即可.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

此前的一篇文章这样解释:在页首制定了DTD,浏览器就认定Web开发者知道并理解DTD,于是就会使用兼容标准的方式来解析和渲染页面.

6. PNG图片不能透明bug

在IE6中,PNG图片原本透明的部分被渲染成不透明的颜色.可以使用这篇文章提到的办法修复之.
其实这个bug只会出现在设置为alpha透明方式的png图片上,导引色透明方式在IE6中则不会出现不能透明的bug.

参考资料

Microsoft STBC HPC面试

三 14

nocoo微软技术, 心情日记 Microsoft 2 Comments

hpc_headers_04_sl

寒假的时候让杨光帮我投了下简历，然后过了一阵子就组织面试了。说起来比较神奇，之前我在joinms里自己投过简历，没多久就收到STBC的HR写来的written test通知，我延了一次，第二次约好的时间因为和杨光介绍过去的STBC HPC的电话面试时间冲突，被我拒掉了…神奇的是，当STBC HPC电话面试结束后，收到的却是之前写来written test通知的同一个HR发来的on site面试通知…岂不是给人一种错觉：Microsoft的written test通知直接无视即可获得面试机会，呵呵。
Anyway，STBC是一个很远的地方，我九点半出门，约好下午一点面试，我觉得肯定够用了，说不定还能找个KFC吃顿像样的饭，没想到当我最终赶到，是12点50分…
饿着肚子面试一下午，三个FTE（最后一个是STBC HPC组的一个PM），每人一小时，当我回到学校的时候已经是晚上7点，一天被占用掉了～
面试过程…没什么好说的，实验室这边不见得会放我走，所以我去的时候是抱着面着玩的心态去的，无欲无求我就很放松，所以一点也不紧张。第二个小伙是个复旦的帅哥，被他一阵鄙视算法，无奈了，还是继续加油吧…
不过收获总是有的，至少我知道了别人是怎么看待我的简历的，他们注意些什么，不注意些什么，看来简历要大改了～

[译作]新白宫网站代码分析

一 21

nocooWeb标准化研究, WordPress, 开发心得, 影音娱乐, 微软技术, 服务器和集群技术 ASP.NET, 微软 9 Comments

概述. 在美国第44任总统就职日这个历史性的日子，让我们来分析一下新的白宫网站（whitehouse.gov）代码结构吧。网站基于ASP.NET构建。

[singlepic=18466]

whitehouse.gov网站使用IIS 6.0. 网站的HTTP头信息中包含键值对”Server: Microsoft-IIS/6.0″。网站并没有使用微软公司最新版本服务器软件，IIS/7。

whitehouse.gov网站使用ASP.NET 2.0. HTTP头中标识自己的程序版本为”X-Aspnet-Version: 2.0.50727″。这个信息可以去掉，这样可以为每次服务器响应节省30字节带宽。

whitehouse.gov网站使用JQuery 1.2.6. JQuery JavaScript库，使用了其最小集版本，位于/includes/文件夹下。很多开发者使用Google服务器托管的JQuery以便提升性能和减小下载脚本的延迟时间。这样做可以提升站点性能。

<script type="text/javascript" src="/includes/eop/jquery-1.2.6.min.js"></script>

whitehouse.gov网站使用GZIP压缩. 所有网站文本都采用了GZIP压缩，显著地提升了性能。

未压缩大小:  48218 bytes
压缩后大小:   8370 bytes
节省带宽:           ~80%

whitehouse.gov网站使用Vary: Accept-Encoding. 在HTTP头中添加Vary: Accept-Encoding是一种强制代理不向不能解码GZIP的客户端发送GZIP内容的手段。

whitehouse.gov网站使用Cache-Control: private和max-age. 它使用了”max-age=85895“，大约1 天。这样，html页面应该只会在你的计算机中缓存1天。

whitehouse.gov网站使用Web Trends Live追踪技术. WebTrends声称是“领先的网页分析和客户为中心智能市场营销解决方案（leading provider of web analytics and consumer-centric marketing intelligence solutions）。”

whitehouse.gov网站使用meta keywords标记. 这样做很奇怪，因为Internet上的访问者很少有不知道这里是干什么的。meta标记如下：

<meta name="keywords" content="President, Barack Obama, White House,
United States of America, 44th President, White House history, President Obama,
Barck, Barek, Barak, Barrack, Barrak, Obma, Barack" />

这样并不会对提升whitehouse.gov网站的Google PageRank有多少贡献。我认为搜索Barack Obama的用户无论如何都会被导引到这个网站的。

whitehouse.gov网站使用ViewState. 这是一个隐藏表单，允许网站在浏览器中存储服务器端数据。ASP.NET自动解析发送到浏览器的ViewState信息。浏览器不应该解析这个信息。

whitehouse.gov网站使用WebResource.axd. 这是ASP.NET生成的一个脚本文件。通常它们不能被有效地缓存，并且我发现它们的确降低了性能。

whitehouse.gov网站包含了很多空白字符. 如果你的浏览器启用了GZIP，这并不会带来性能影响，但是如果去掉这些空白字符，网站代码可以减小20%以上。

whitehouse.gov网站包含注释标签. 网站使用了很多HTML注释分割页面代码区域。如果能将这些注释写在服务器端代码中，可以在编译页面时不将注释编译在最终页面代码中，从而提升效率。

<!-- Start -->
<!-- End -->

whitehouse.gov网站包含很长很长的ASP.NET ID. 页面中的很多元素包含非常长的ID，是浪费带宽的主要因素之一。这些长ID可以很容易地在服务器端替换成短ID。

<a id="ctl09_rptNavigation_ctl00_rptNavigationItems_ctl01_hlSubNav"...

whitehouse.gov网站使用的GIF多于PNG. 网站使用的GIF图片多于PNG图片。PNG格式的图片可以更加优化，从而节省带宽和消耗。网站中使用了两个GIF动画。

whitehouse.gov网站使用了5个层叠式样式表（stylesheets）文件和12个JavaScripts脚本文件. 如果能把这两类文件合并成两个文件，网站可以更快而且更轻量级。当然这是针对访问首页的访客而言。奇怪的是，用于修饰管理页面的层叠式样式表也被加载进了普通用户的访问中：

/* admin styles */
/* cms */
.adminNavigation {width:996px; position:relative; z-index:100;}

whitehouse.gov网站使用了高度压缩的JPG. 如果你距离屏幕较远，或者视力不是那么好，这些图片看起来还行。开发者对JPG图片采用了高度压缩。这里显示的图片被放大并且轻微地二次压缩过。

[singlepic=18465]

whitehouse.gov网站使用了image sprites技术. 这项技术可以大幅提升站点性能，因为它将若干个小图片合并成了一张图片。这是一项先进的技术。采用了image sprites技术的图片是”nav-sprite.png“.

whitehouse.gov网站使用了Packer. Dean Edward的Packer是一个用于压缩JavaScript文件的工具。JavaScript脚本将在被下载时自动解压缩，这是一项很差的优化手段，因为往往JavaScript经过GZIP压缩之后，比经过YUI压缩器（YUI Compressor）压缩之后更小。[参见 jquery-plugins.js]

eval(function(p,a,c,k,e,d)...

使用Packer的决定不像是一个深入了解GZIP或者文本压缩技术的人做出的。压缩之前的文件确实变小了，然而这导致了最终需要被下载的文件变大了。[http://dean.edwards.name/packer/]

whitehouse.gov大小821 KB，在我的线路上（cable modem）使用了1.58秒完成加载。这个数字大约是新的、基于图片的网站的平均值。

加载时间:  1.58 seconds
总计大小:  821 KB

whitehouse.gov网站包含了几个隐藏链接. 在源文件里，大部分是在JavaScript中，大约嵌入了6个链接。这样，这些幸运的人就得到了来自白宫网站的外链（译者注：PageRank 9啊！9！）。

www.youngpup.net

http://sorgalla.com/jcarousel/

http://billwscott.com/carousel/

http://www.codylindley.com

whitehouse.gov网站使用了一个不透明的favicon.ico. 为了站点在加入书签后具有更好的视觉效果（译者注：对很多非IE浏览器而言，无论是否加入书签，favicon文件都会显示在标签栏），一个具有透明背景的favicon是更好的选择。这项改变对于一个知道怎么修改的人来说可以在10分钟内完成。

结论是，whitehouse.gov网站还是很吸引人的。虽然它并不算是一个非常有效率的站点，并且过多地注意了视觉效果。一个网站优化专家可以在几天之内将它的加载速度提升到现在的两倍。

最后，记住本届政府和奥巴马总统并不是写这些代码的人。

翻译自：http://dotnetperls.com/Content/whitehouse-gov-Site.aspx

Let’s Start From Here

一 20

nocoo影音娱乐, 微软技术, 行摄, 资料文献歌曲 1 Comment

A little jazz, help you to move on.

Let’s Start From Here
王若琳
giving up, why should i
we’ve come to far to forget
we’re beautiful, we just got lost
somewhere along the way
so much was missing when you went away
let’s start from here, lose the past
change our minds, we don’t need a finish line
let’s take this chance don’t think too deep
and all those promises we couldn’t seem to keep
i don’t care where we go
let’s start from here
standing here face to face
a finger on your lips
don’t say a word don’t make a sound
silence surrounds us now
even when you were gone i felt you everywhere
let’s start from here, lose the past
change our minds, we don’t need a finish line
let’s take this chance don’t think too deep
and all those promises we couldn’t seem to keep
i don’t care where we go
let’s start from here
let’s start from here
i’ve never been the one to open up
but you’ve always been the voive within
the only warmth from my cold heart
let’s start from here, lose the past
change our minds, we don’t need a finish line
let’s take this chance don’t think too deep
and all those promises
let’s start from here, lose the past
change our minds
we don’t need a finish line
let’s take this chance don’t think too deep
and all those promises we couldn’t seem to keep
i don’t care where we go
let’s start from here
let’s start from here
let’s start from here
let’s start from here

Nocoo.Weblog