新浪博客前端架構(gòu)分享

1、新浪博客前端架構(gòu)新浪博客RIA開發(fā)團(tuán)隊 Blog： Email ： Random.Hao.2010年10月30日1代碼框架代碼的加載與執(zhí)行開發(fā)流程架構(gòu)實例2代碼框架3sina包lib包productJavascript框架概覽基礎(chǔ)庫通用組件產(chǎn)品需求4sina包結(jié)構(gòu)5是基礎(chǔ)庫，最底層的代碼為上層提供服務(wù)不涉及產(chǎn)品需求sina包功能顆粒度小隔離了細(xì)節(jié)，提供抽象的接口6lib包結(jié)構(gòu)7lib包提供通用的可復(fù)用功能組件交互效果各產(chǎn)品之間的公共功能托盤登錄suggest一般的配置信息8product博客相冊個人中心活動站9product各產(chǎn)品代碼獨立方便管理、維護(hù)、擴(kuò)展通過打包發(fā)布調(diào)用lib和sina包的

2、模塊針對產(chǎn)品需求編碼以Job的形式注冊代碼通過不同的頁面id加載代碼10代碼的加載與執(zhí)行11Job1Pageid頁面1頁面2頁面3Job2Job3Job4Job5Job6PageidPageid代碼按Job加載12JobJob通過pageid組織一個大的功能可拆分成多個Job可把復(fù)雜的問題相對簡單化一個Job可以被多個頁面使用相同的功能可復(fù)用13Job代碼$registJob(“jobTest, function () alert(“I am a job test,hahaha”);$registJob(“jobTestToo, function () alert(“I am 還是 a job

3、 test,lalala”);14pageid引導(dǎo)頁代碼function main () var job = new Jobs();job.add(jobTest);job.add(jobTestToo);job.start();15Boot.js頁面節(jié)點裝載完成后執(zhí)行入口function_addDOMLoadEvent(main);1617開發(fā)流程18調(diào)試模式上線模式開發(fā)模式未壓縮合并的代碼支持調(diào)試工具合并壓縮的代碼線上文件名為頁面id.js19開發(fā)順序1.從SVN中取出代碼不同的產(chǎn)品在不同的svn目錄（博客、相冊、個人中心、活動站）2.開始本地開發(fā)和調(diào)試1) XAMPP搭建本地開發(fā)環(huán)境2) ftp到專門的開發(fā)機(jī)203.提交到SVN合并代碼解決因多人開發(fā)造成的代碼沖突4.打包測試5.上線專門的打包工具（合并、壓縮、生成頁面id.js）打包的shell命令：sh p 產(chǎn)品名 t svnTag地址 o在svn中生成一個新的上線tag