CorePress Pro S 架構設計
CorePress Pro S是CorePress Pro的重構版,采用了全新的架構設計,性能和易用性成倍提高。
CorePress的誕生,是因為本人在尋找WordPress主題中,沒有一款滿足我的需求,索性自己寫一款出來。從第一個版本迭代到現在,已經2年時間了,WordPress該踩的坑已經踩的差不多了。而CorePress主題,也是在踩坑中,慢慢健全的。CorePress比起其他的主題,特點就是每行代碼,都是我親自寫出來的(一些前端庫除外),甚至是UI界面,也是我一行一行敲出來的。
同時,主題使用了當時比較前沿的技術,vue.js+element ui,同時在各種功能都具備的情況下,包括字體文件等,將主題體積控制到了2M,里面每行代碼,我都知道是干什么用的,目前市面上功能完善,體積小巧的主題并不多。
而在踩坑的這兩年里面,對于WordPress和PHP有了全新的認識,而現有主題,采用的面向過程的代碼類型,已經不滿足后續拓展需要了。盡管主題代碼自認為比較優秀,但是距離想要的樣子,差距較大,而最好的解決辦法,就是推倒重來。
在新版本,我完全使用了面向對象的編程方式,功能模塊全都封裝了成類使用,并且使用單例模式來提高性能。同時,我自寫了一套框架,在WordPress中,實現了autoload,來自動加載類。
將主題模塊化,設計了主題自己的模板系統,只需要繼承模板類,就能很輕松的實現新模板創建。也就意味著,Pro S,可以很方便的做成任何想要界面。
同樣,除了模板,我還將頁面的每個模塊,都獨立出來了。例如導航欄,幻燈片,文章列表,都是一個獨立的模塊。component文件夾中,每個子文件夾,都是一個模塊,要什么,做什么。
使用也非常方便,能自動加載style樣式以及JS,在模板界面中,一行代碼即可調用。
這次主題,采用了最新的vue3和element plus,實現了后臺設置功能。并且后臺設置,通過解析JSON來實現可視化編輯,不用再像以前,添加一個設置,制作一個界面了。
這種解析方式,節省了非常多的代碼冗余,并且方便添加更多的設置項目。
前端設計的時候,同樣考慮了SEO的優化。由于vue是在用戶端渲染,所以,會避免一些重要的內容使用vue渲染,例如文章標題、內容等信息,還是使用PHP輸出。而在一些無關緊要的內容上,例如評論組件,側邊欄小工具,用戶菜單,則使用vue渲染。實現了評論Ajax顯示等友好功能。
最后,框架基本上搭建完了,剩下的就是一些繁瑣的界面設計工作了。
相信要不了多少時間,Pro S就能和大家見面了。屆時,Pro用戶,支持免費升級到Pro S。
從1.4.0版本開始,主題已經融入Pro S了