A. apache traffic server怎麼配置webui
一 介紹
Apache Traffic Server（ATS或TS）是一個高性能的、模塊化的 HTTP 代理和緩存伺服器。Traffic Server 最初是 Inktomi 公司的商業產品，該公司在 2003 年被 Yahoo 收購，之後 Traffic Server 一直在 Yahoo 內部使用長達 4 年，直到 2009 年 8 月 Yahoo 向 Apache 軟體基金會（ASF）貢獻了源代碼，並於 2010 年 4 月成為了 ASF 的頂級項目（Top-Level Project）。 Apache Traffic Server 現在是一個開源項目，開發語言為C++。
Traffic Server 的開發團隊曾經由 Chuck Neerdaels 領導，他也是 Harvest 項目的早期創始人之一，Harvest 項目後來發展為十分流行的 Squid 項目；Leif Hedstrom 直接管理著現在的 Traffic Server 開發團隊。目前 Chuck Neerdaels 和 Leif Hedstrom都已加盟知名 CDN 服務提供商 Akamai。
HTTP 代理伺服器是 HTTP 伺服器的一種實現，處於客戶端（一般為瀏覽器）與另一個 HTTP 伺服器之間（通常指源伺服器，Origin Server）。HTTP 代理通常分為正向代理、反向代理和透明代理，我們主要關注的是反向代理（Reverse Proxy，見下圖）反向代理伺服器根據明確配置的映射規則來處理用戶請求。反向代理伺服器通常會設置一個較大的緩存區，伺服器處理請求的同時將請求的內容緩存在伺服器本地，當下次用戶請求同一個對象時，伺服器可直接從緩存區里取出對象，而不用去源伺服器去取，起到了加速的效果。另外，配置反向代理的映射規則也能實現負載均衡的功能。除了 Traffic Server，常見的開源代理伺服器還有 Squid，Varnish，Nginx，HAProxy。
Apache <wbr>Traffic <wbr>Server <wbr>簡介
Traffic Server 在 Yahoo 內部使用了超過 4 年，主要用於 CDN 服務，CDN 用於分發特定的 HTTP 內容，通常是靜態的內容如圖片、JavaScript、CSS。下面是Traffic Server 在 Yahoo CDN 應用的一些情況：
超過 4 年的使用中，緩存中沒有出現已知的數據損壞（data corruption）；
作為反向代理，伺服器方便部署和管理，並且大部分配置的更改可直接在線上伺服器完成，而不用重啟服務；
在高並發情況下擴展良好，支持 HTTP/1.1 協議特性，如 SSL、Keep-Alive；
在世界范圍內部署了超過 100 台伺服器；
在實際CDN中，每秒處理超過 350,000 次請求，達到 30 Gbps，最大容量至少十倍於普通使用，以應對高峰時的大量請求；
在實際 CDN 中，每台伺服器有 20,000 到 30,000 的 keep-alive 並發連接，其中有 1,000 到 2,000 的連接是一直很活躍的；
實驗環境中，單台伺服器每秒處理 105,000 次請求，請求的對象是被緩存住的小文件；
實驗環境中，請求大文件時，單台伺服器達到 3.6 Gbps（4x GigE NIC bonded）。
二 組件、機制
Traffic Server（TS） 的組成
1.Traffic Server緩存
TS 緩存包含一個高速的對象資料庫，資料庫根據 URL 和相關頭部來索引對象，對於同一對象可以緩存不同版本（如不同的編碼、語言）。
當緩存空間滿後，TS 會移除過期的數據。
當磁碟出錯時，TS 將不再使用該塊磁碟，轉而使用剩下的磁碟。所有磁碟都出錯時，TS 將切換至 proxy-only 模式，即只代理，不緩存。
可分區，即可以給指定的協議和源伺服器劃分一定數量的磁碟空間
2.RAM 緩存
內存緩存區儲存比較熱門的對象，在流量的高峰期時能加快處理速度和降低磁碟負載。
3.主機資料庫
儲存 DNS 信息，方便主機名到 IP 地址的快速轉換
儲存每個主機的 HTTP 版本，方便高級協議特性的使用
儲存主機的可靠性和可用性信息
4.DNS 解析器
TS 原生實現了 DNS 解析器，不依賴較慢的傳統解析庫。同時也降低了 DNS 的流量。
5.Traffic Server 進程
traffic_server 進程負責接受連接，處理協議請求，然後從緩存或源伺服器獲取對象並返回
traffic_manager 進程是 TS 的命令和控制設施，負責啟動、監控和配置 traffic_server 進程，它也負責代理的埠配置、統計信息的介面、集群管理和虛擬 IP 的故障轉移。
如果 traffic_manager 檢測到 traffic_server 進程失效，它立即重啟 traffic_server 進程並且維護一個連接隊列，保存此時到來的請求，完全重啟後這個隊列里的連接將按順序被處理。
traffic_cop 進程監視 traffic_server 和 traffic_manager 進程，此進程周期性的查詢 traffic_server 和 traffic_manager 進程的健康狀況，如果查詢在一定間隔時間內未返回或者返回信息不正確，traffic_cop 將重啟 traffic_manager 和 traffic_server 進程。
Apache <wbr>Traffic <wbr>Server <wbr>簡介
6.管理工具
Traffic Line 是命令行程序，可以用來快速監視 Traffic Server 的性能和網路流量，也能配置 TS。
Traffic Shell 也是命令行工具，進入該 shell 後有自己一套語法，可代替 Traffic Line 完成監控、配置任務。
通過 Traffic Line 和 Traffic Shell 對配置作出的修改將會自動寫入配置文件中。
Traffic Server 的底層機制
Apache Traffic Server 不同於大部分開源代理伺服器，它結合了兩種技術來處理高並發：
非同步事件處理（Asynchronous event processing）
多線程（Multi-threading）
Traffic Server 在多 CPU、多核的硬體上擴展良好，能充分利用所有可用的 CPU 和其他資源。
HTTP 代理緩存相關機制
1. Traffic Server 處理請求的過程
1）用戶請求一個 web 對象，TS 收到請求
2）TS 通過對象的地址，在對象資料庫（緩存）中去定位該對象
a.如果對象在緩存中，TS 會檢查對象是否新鮮（fresh）
如果新鮮，TS 從緩存里返回該對象給用戶，此時稱為緩存命中（cache hit）
如果不新鮮（stale），TS 會連接源伺服器去驗證對象是否仍然新鮮，即重新驗證（revalidation），如果仍然新鮮，TS 立即將緩存中的副本返回給用戶
b.如果對象不在緩存中（緩存未命中，cache miss），或者緩存的副本不再有效，TS 會去源伺服器獲取對象，然後同時做下面兩件事
將對象返回給用戶
將對象放到本地緩存中
2. Traffic Server 判斷 HTTP 對象是否新鮮（fresh）的過程
如果有 Expires 或者 max-age 頭部直接定義緩存的過期時間，TS將對比當前時間和過期時間去判斷對象是否新鮮
如果沒有上述頭部，TS 將檢查 Last-Modified 和 Date 頭部（其中Date是源伺服器返回對象的時間，如果沒有 Last-Modified 頭部，TS 會用對象寫入緩存的時間以作代替），然後用以下公式算出新鮮的時間范圍（freshness_limit，可理解為保質期）:
freshness_limit = ( Date - Last-Modified ) x 0.1
0.1 這個參數可以作調整，並且能限制 freshness_limit 的上下限，默認最小是 1 小時，最大是 1 天
如果沒有 Expires 頭部或者沒有 Last-Modified、Date 頭部，TS 將使用默認的 fressness limit
另外，TS 還會檢查 cache.config 配置文件中的 revalidate 規則，該規則可以對特定的 HTTP 對象設置特定的驗證時間（特定的域名、IP、一定規則的 URL、特定的客戶端等等）
3. 緩存過期（stale），Traffic Server 去源伺服器重新驗證對象可能的情況
仍然 fresh，TS 重置 freshness_limit，並返回對象
對象新副本可用，TS 緩存新對象，並同時返回給用戶
源伺服器上的對象不再存在，TS 也不再返回該副本給用戶
源伺服器沒有響應，TS 返回過期的對象並發出警告。
更詳細的說明請查看 Traffic Server 管理文檔中的 HTTP Proxy Caching 部分
三 安裝、使用
Apache Traffic Server 開源後添加了 64 位支持，也移植到了常見的 Linux 發行版、FreeBSD、OpenSolaris 和 Mac OS X，開源之前 Yahoo Traffic Server 一直運行在 32-bit Linux 上。
（以 Apache Traffic Server 2.1.1 unstable 為例在 32-bit Linux 環境下進行安裝測試）
安裝
1. 下載、解壓
wget http://www.apache.org/dist/trafficserver/trafficserver-2.1.1-unstable.tar.bz2
wget http://www.apache.org/dist/trafficserver/trafficserver-2.1.1-unstable.tar.bz2.md5
md5sum -c trafficserver-2.1.1-unstable.tar.bz2.md5
tar jxvf trafficserver-2.1.1-unstable.tar.bz2
cd trafficserver-2.1.1-unstable
2. 編譯、安裝
查看 README 說明文檔，安裝編譯依賴的庫（centos 可參照 fedora 依賴的軟體包，pcre包替換為 pcre-devel 即可）
./configure --help 查看編譯的一些選項
./configure （默認安裝在 /usr/local，如需修改，使用 --prefix=PREFIX；參數中還有用戶和用戶組選項，這是 TS 進程運行的身份，默認均為 nobody，centos 可以不作修改，其他發行版可能需要修改，如 ./configure --with-group=nogroup）
make
make install 以管理員身份執行
目錄結構
默認目錄
內容
/usr/local/var/log/trafficserver
運行時創建的日誌文件
/usr/local/var/trafficserver
運行時的一系列文件
/usr/local/etc/trafficserver
配置文件
/usr/local/bin
可執行文件
/usr/local/libexec/trafficserver
插件
初步配置
records.config 是 key-value 格式的配置文件，負責大部分全局的選項設置，即主配置文件。
storage.config 用於指定磁碟存儲。
remap.config 定義映射規則，用於請求的重寫（rewrite），反向代理即在此配置。
records.config 中關鍵的配置
CONFIG proxy.config.exec_thread.autoconfig INT 1
CONFIG proxy.config.exec_thread.autoconfig.scale FLOAT 2.0
CONFIG proxy.config.exec_thread.limit INT 2 # 經觀察是每個核創建的線程數，官方文檔中未提及
CONFIG proxy.config.cluster.ethernet_interface STRING eth0 # 設置乙太網介面
CONFIG proxy.config.http.server_port INT 8080 # 監聽埠，反向代理通常為80
LOCAL proxy.local.incoming_ip_to_bind STRING 0.0.0.0 # 綁定的 IP，可省略，默認即為 0.0.0.0
CONFIG proxy.config.http.cache.http INT 1 # 打開緩存功能
CONFIG proxy.config.cache.ram_cache.size INT 512M # RAM 緩存大小
CONFIG proxy.config.reverse_proxy.enabled INT 1 # 打開
CONFIG proxy.config.url_remap.remap_required INT 1 # 1為只反向代理，0為正向+反向代理
CONFIG proxy.config.url_remap.pristine_host_hdr INT 0
CONFIG proxy.config.ssl.enabled INT 0 # 關閉SSL
CONFIG proxy.config.ssl.server.cert.filename STRING server.pem
CONFIG proxy.config.http.server_max_connections INT 2000 # 同源伺服器的最大連接數
CONFIG proxy.config.http.keep_alive_no_activity_timeout_out INT 60 # 當一個事務結束後同原伺服器保持連接的時間
remap.config 配置
map http://cdn.example.com/js http://js.example.com # 通過 DNS 輪詢可實現負載均衡
reverse_map http://js.example.com http://cdn.example.com/js # reverse_map 能在源伺服器 有 HTTP 重定向跳轉時，修改重定向請求，即重寫 Location 頭部內容
map http://cdn.example.com/css http://css.example.com
reverse_map http://css.example.com http://cdn.exampe.com/css
map http://cdn.example.com/img http://img.example.com
reverse_map http://img.example.com http://cdn.example.com/img
storage.config 配置
/data1 67108864 # 指定一個或多個目錄，註明緩存大小，也可直接指定 raw 分區，詳見storage.config 中的注釋說明
更詳細的配置可參考官方管理指南 http://trafficserver.apache.org/docs/v2/admin/
服務控制
運行 /usr/local/bin/trafficserver start
結束 /usr/local/bin/trafficserver stop
重啟 /usr/local/bin/trafficserver restart
命令行工具、監控
/usr/local/bin/traffic_line 需用管理員身份執行
查看幫助 traffic_line -h
查看變數的值 traffic_line -r 變數名 （變數名見官方管理指南附錄C，含 TS 運行時統計數據）
給變數賦值 traffic_line -s 變數名 -v 值 （變數名見records.config）
不重啟TS 使配置生效 traffic_line -x
/usr/local/bin/traffic_shell 需用管理員身份執行，進入後提示符為「%」
查看幫助 man traffic_shell （由於開發者疏忽，暫不能用）
show 命令，如 %show:cache-stats 查看緩存統計，如命中情況，緩存大小；如%show:proxy-stats 查看命中率
config 命令，如 %config:logging event disable 關閉日誌；如 %config:cache clear，清除緩存，config命令作出的修改都會立即生效
/usr/local/bin/traffic_logcat 日誌查看工具
traffic_logcat -h 獲得幫助
查看二進制日誌 traffic_logcat 日誌文件名
Traffic Server 系統自身的運行日誌可在 /var/log/message 中查看（centos），用於排錯
traffic_logstats 提供了基於日誌的統計功能
四 結論
Apache Traffic Server 開源後功能在不斷被開發，性能得到很大提升，社區也在逐漸發展，但除了 Yahoo 之外還很少有其他實踐，很多功能（如集群）的文檔有待完善。Traffic Server 豐富的插件開發是其一大亮點，模塊化的特點使其擁有很好的擴展性和靈活性，再加上它的高性能，相信 Apache Traffic Server 未來將在很多場景中替代傳統的代理和緩存伺服器而成為大家的首選。
B. 推薦幾個流行的WEB UI開源框架
1.Aliceui
Aliceui是支付寶的樣式解決方案，是一套精選的基於 spm 生態圈的樣式模塊集合，是 Arale 的子集，也是一套模塊化的樣式命名和組織規范，是寫 CSS 的更好方式。
gitHub地址：https://github.com/aliceui/aliceui.github.io
2.Amazeui
Amaze UI 是一個輕量級、 Mobile first 的前端框架, 基於開源社區流行前端框架編寫的。
官網地址：http://amazeui.org/
3.sui
SUI是一套基於bootstrap開發的前端組件庫，同時她也是一套設計規范。
通過SUI，可以非常方便的設計和實現精美的頁面。
官網地址：http://sui.taobao.org/
同時sui還有移動端版本msui，msui是阿里巴巴共享業務事業部UED團隊的作品。目的是為了手機H5頁面提供一個常用的組件庫，減少重復工作。
地址：http://m.sui.taobao.org/
4.FrozeUI
Frozen UI是一個開源的簡單易用，輕量快捷的移動端UI框架。基於手Q樣式規范，選取最常用的組件，做成手Q公用離線包減少請求，升級方式友好，文檔完善，目前全面應用在騰訊手Q增值業務中。
官網地址：http://frozenui.github.io/
5.uiKit
uiKit是一款輕量級、模塊化的前端框架，可快速構建強大的web前端界面。
官網地址：http://www.getuikit.net/
6.H-ui
H-ui是輕量級前端框架，簡單免費，兼容性好，適用於中國網站。
官網地址：http://www.h-ui.net/
7.Weui
weUI 是一套同微信原生視覺體驗一致的基礎樣式庫，由微信官方設計團隊為微信 Web 開發量身設計，可以令用戶的使用感知更加統一。包含button、cell、dialog、 progress、 toast、article、actionsheet、icon等各式元素。
官網地址：https://github.com/weui/weui
8.layui
Layui 誕生於2016年金秋，是一款帶著濃烈情懷的國產前端UI框架，她追求極簡，又不失豐盈的內在，說她是史上最輕量的結晶，似乎並不為過。一切都源自於她對原生態的執著，對前端社區的那些噪雜聲音的過濾，以及她本身的精心雕琢。
官網地址：http://www.layui.com/
9.YDUI Touch
YDUI Touch 專為移動端打造，在技術實現、交互設計上兼容主流移動設備，保證代碼輕、性能高;使用 Flex 技術，靈活自如地對齊、收縮、擴展元素，輕松搞定移動頁面布局;實現強大的屏幕適配布局，等比例適配所有屏幕。什麼？用得不開心？輕松切換 px;自定義Javascript組件、Less文件、Less變數，定製一份屬於自己的YDUI;
C. JS前端web開源框架miniui懶載入樹形結構太慢，有什麼優化方法嗎
easy-ui,或者直接用bootstrap，都很不錯的，你可以先了解了解再選用.
D. 開源Nginx可視化配置工具，快速搞定Nginx配置難題
《開源精選》是我們分享Github、Gitee等開源社區中優質項目的欄目，包括技術、學習、實用與各種有趣的內容。本期推薦的是一個Nginx界面配置工具——nginxWebUI。
nginxWebUI是一款圖形化管理nginx配置的工具, 可以使用網頁來快速配置nginx的各項功能， 包括http協議轉發、tcp協議轉發、反向代理、負載均衡、靜態html伺服器、ssl證書自動申請、續簽、配置等，配置好後可一建生成nginx.conf文件， 同時可控制nginx使用此文件進行啟動與重載，完成對nginx的圖形化控制閉環。
本項目是基於solon的web系統，資料庫使用h2， 因此伺服器上不需要安裝任何資料庫。
本系統通過Let's encrypt申請證書，使用acme.sh腳本進行自動化申請和續簽，開啟續簽的證書將在每天凌晨2點進行續簽，只有超過60天的證書才會進行續簽，只支持在linux下簽發證書。
添加tcp/ip轉發配置支持時， 一些低版本的nginx可能需要重新編譯，通過添加–with-stream參數指定安裝stream模塊才能使用，但在ubuntu 18.04下，官方軟體庫中的nginx已經帶有stream模塊，不需要重新編譯。本系統如果配置了tcp轉發項的話，會自動引入ngx_stream_mole.so的配置項，如果沒有開啟則不引入，最大限度優化ngnix配置文件。
打開 http://ip:8080 進入主頁。
登錄頁面，第一次打開會要求初始化管理員賬號。
進入系統後，可在管理員管理裡面添加修改管理員賬號。
在http參數配置中可以配置nginx的http項目，進行http轉發，默認會給出幾個常用配置，其他需要的配置可自由增刪改查，可以勾選開啟日誌跟蹤，生成日誌文件。
在TCP參數配置中可以配置nginx的steam項目參數，進行tcp轉發。
在反向代理中可配置nginx的反向代理即server項功能，可開啟ssl功能，可以直接從網頁上上傳pem文件和key文件，或者使用系統內申請的證書，可以直接開啟http轉跳https功能，也可開啟http2協議。
在負載均衡中可配置nginx的負載均衡即upstream項功能，在反向代理管理中可選擇代理目標為配置好的負載均衡。
在證書管理中可添加證書，並進行簽發和續簽，開啟定時續簽後，系統會自動續簽即將過期的證書。
備份文件管理，這里可以看到nginx.cnf的備份 歷史 版本，nginx出現錯誤時可以選擇回滾到某一個 歷史 版本。
最終生成conf文件，可在此進行進一步手動修改，確認修改無誤後，可覆蓋本機conf文件，並進行校驗和重啟，可以選擇生成單一nginx.conf文件還是按域名將各個配置文件分開放在conf.d下。
遠程伺服器管理，如果有多台nginx伺服器，可以都部署上nginxWebUI，然後登錄其中一台，在遠程管理中添加其他伺服器的ip和用戶名密碼，就可以在一台機器上管理所有的nginx伺服器了。
提供一鍵同步功能，可以將某一台伺服器的數據配置和證書文件同步到其他伺服器中。
本系統提供http介面調用，只要開 http://xxx.xxx.xxx.xxx:8080/doc.html 即可查看smat-doc介面頁面。
介面調用需要在header中添加token，其中token的獲取需要在管理員管理中，打開用戶的介面調用許可權，然後通過用戶名密碼調用獲取token介面，才能得到token，然後在knife4j的文檔管理中設置全局token。
jar安裝說明：
以Ubuntu操作系統為例：
1 安裝java運行環境和nginx
Ubuntu：
Centos：
Windows：
2 下載最新版發行包jar
有新版本只需要修改路徑中的版本即可。
3 啟動程序
docker安裝說明
本項目製作了docker鏡像，同時包含nginx和nginxWebUI在內，一體化管理與運行nginx。
1 安裝docker容器環境
ubuntu：
centos：
2 下載鏡像
3 啟動容器
—END—
開源協議：MulanPSL-1.0
開源地址：https://github.com/cym1102/nginxWebUI
E. 請問，web框架有哪些種
1.Bootstrap
Bootstrap 是最受歡迎的 HTML、CSS 和 JS 框架，用於開發響應式布局、移動設備優先的 WEB 項目。
2.NEJ-Nice Easy Java
簡潔，美觀，真正的跨平台web前端開發框架。
3.Foundation
迄今為止最好的響應式前端框架，更快、更輕、更多功能、更靈活、更強大!
4.Amaze UI
是一個輕量級的前端框架， 基於開源社區流行前端框架編寫，中國首個開源 HTML5 跨屏前端框架。
5.jQueryweui
是專為微信公眾賬號開發而設計的一個簡潔而強大的UI庫，包含全部WeUI官方的CSS組件，並且額外提供了大量的拓展組件，豐富的組件庫可以極大減少前端開發時間。
6.FrozenUI - 專注於移動web的UI框架
簡單易用，輕量快捷，為移動端服務的前端框架
7.SUI Mobile
輕量，小巧且精美的UI庫，方便迅速搭建手機H5應用
F. Web前端工程師喜歡的高質量Web前端框架有哪些
今天小編要跟大家分享的文章是關於高質量Web前端框架，相信很多Web前端工程師都會對此感興趣的。Web前端框架就是為了節約開發成本和時間，一般開發一個項目都會用到前端框架(除非自己有前端開發團隊)。今天小編就為大家分享一些高質量的前端框架希望能夠對大家有所幫助。
一、QUICKUI
QUICK
UI是一套完整的企業級web前端開發解決方案，由基礎框架、UI組件庫、皮膚包、示例工程和文檔等組成。使用QUICKUI開發者可以極大地減少工作量，提高開發效率，快速構建功能強大、美觀、兼容的web應用系統。
QUICKUI優勢：
①功能最為強大
QUICKUI經歷了7年的迭代更新，不斷從客戶的各種業務中對組件的需求進行歸納和抽離，從而打造新的組件和功能。現在最新的4.0版本框架包含了一百多種組件，一千多個應用場景示例。可以說在前端框架領域中，QUICKUI擁有功能最強大組件庫。
②運行最為穩定
很多其他的第三方UI控制項在簡單場合使用OK，到了復雜的場景中就會出現很多問題，這種現象很常見，因為在組件設計時無法預料到所有的應用場合。而QUICKUI在7年間經歷了數千個項目實際檢驗，在各種復雜場景都應用過，並根據客戶的反饋不斷完善和調整。目前的第四代可以說是最穩定、最完美的版本。
③豐富精美的界麵皮膚
跟其他web前端框架僅僅是一套組件庫不同，QUICKUI是一整套前端解決方案，擁有豐富的外觀界面解決方案。採用現今流行的扁平化設計理念，推出了包括登錄、響應式web、工作桌面、地圖類、門戶風格、大屏展示風格等等幾百套製作精美、用戶體驗優秀的界面。這些界面是以QUICKUI皮膚包的形式發布，使用和更換都非常方便。
④事無巨細的開發文檔
QUICKUI擁有16萬字+的開發文檔，框架和組件的每一個功能點都有詳細的講解和代碼示例，用於開發過程中隨時查閱。除了框架機制講解和組件使用教程，文檔還涉及web前端開發的很多知識。仔細閱讀並結合框架使用的話，你很快就能成為web開發的高手。
⑤上手開發非常容易
QUICKUI採用組件化思想來構建組件，一個組件就是一兩句html的標簽，使用起來非常簡單。將開發人員從繁瑣的JS編碼中解脫出來，很大程度減少前台編碼的出錯率;保留了HTML的布局方式，從而快速進行頁面布局。對開發者前台技術要求也非常低，只需要了解html語法和一些簡單的JS即可，從而把更多精力放在業務功能的實現上，極大地提高開發效率。
⑥瀏覽器兼容性非常好
QUICKUI4.0使用了很多HTML5，CSS3技術用於提高表現力和用戶體驗，這些新的特性在現代瀏覽器中會有很好的效果。但是，國內依然有大量的用戶在使用IE7、IE8等舊時代的瀏覽器，為照顧這部分用戶，框架採用了漸進式思想，確保低版本瀏覽器也能正常使用。所以，QUICKUI兼容IE7以上所有主流瀏覽器。
二、flex
Apache基金會今天發布了Flex4.8版本，這是Adobe將Flex捐獻給Apache基金會後發布的第一個版本。
需要注意的是，Flex目前還在孵化階段，還不是Apache的正式項目，Flex4.8也不是一個正式的Apache版本。
Apache稱，該版本標志著Flex新時代的開始，Flex的未來將由社區來驅動，而不是由一個公司驅動。開發者可以通過貢獻代碼，來幫助改進Flex，如修復bug、增加功能等。
從Macromedia賣給Adobe，然後又捐給apache，不知道搞什麼名堂。不過還好沒有經過大幅重構，否則就真的是悲哀了!
三、extjs
ExtJS是一種主要用於創建前端用戶界面，是一個基本與後台技術無關的前端ajax框架。
功能豐富，無人能出其右。
無論是界面之美，還是功能之強，ext的表格控制項都高居榜首。
華麗的界面，靈活的功能，還有開發工具都是配套的，但有個最大的問題，用就得花錢!
四、easyui
easyui幫助你構建你的web應用更加容易。
它是一個基於jquery的插件，開發出來的一套輕量級的ui框架，非常小巧而且功能豐富。
但是她有一個最大的問題就是代碼只能找到以前的開源的版本，到了1.2以後的版本源代碼都是經過混淆的，如果遇到問題修改起來會非常麻煩!不過一個比較大的優勢是開源免費，並且界面做的還說的過去!
五、jQueryUI
jQueryUI是一套jQuery的頁面UI插件，包含很多種常用的頁面空間，例如Tabs(如本站首頁右上角部分)、拉簾效果(本站首頁左上角)、對話框、拖放效果、日期選擇、顏色選擇、數據排序、窗體大小調整等等非常多的內容。功能非常全面，界面也挺漂亮的，可以整體使用，也可以分開使用其中的幾個模塊，免費開源!
六、MiniUI
又一個基於jquery的框架，開發的界面功能都很豐富。
jQueryMiniUI_快速開發WebUI。
它能縮短開發時間，減少代碼量，使開發者更專注於業務和服務端，輕松實現界面開發，帶來絕佳的用戶體驗。
使用MiniUI，開發者可以快速創建Ajax無刷新、B/S快速錄入數據、CRUD、Master-Detail、菜單工具欄、彈出面板、布局導航、數據驗證、分頁表格、樹、樹形表格等典型WEB應用系統界面。
界面做的挺不錯，功能也挺豐富，但是有兩個比較大的問題，一個是收費，一個是沒有源碼，說白了，不開源!基於這個開發如果想對功能做擴展就需要找他們的團隊進行升級!
七、DWZ
DWZ富客戶端框架(jQueryRIAframework),是中國人自己開發的基於jQuery實現的AjaxRIA開源框架.
設計目標是簡單實用,快速開發,降低ajax開發成本。
畢竟是國產的，支持一下，而且源碼完全公開，可以選擇一下!不過性能怎麼樣不敢確定!
八、YUI
Yahoo!UILibrary
(YUI)是一個開放源代碼的JavaScript函數庫，為了能建立一個高互動的網頁，它採用了AJAX,DHTML和DOM等程式碼技術。它也包含了許多CSS資源。使用授權為
BSD許可證，基本上沒怎麼研究過!YUICompressor倒是挺出名的，這套UI庫不知道應用的情況怎麼樣!
九、Sencha
Sencha是由ExtJS、jQTouch以及Raphael三個項目合並而成的一個新項目。
大公司的框架，並且是幾樣庫的強強聯合，值得推薦!
十、OperaMasks-UI
OperaMasks-UI是OperaMasks團隊2011下半年打造的一款輕量級前端JS組件庫，旨在提供一款學習曲線低、定製性靈活、樣式統一，且多瀏覽器支持、覆蓋企業業務場景的前端JavaScriptUI組件庫。目前，該團隊已將這一產品以LGPL開源協議開放給社區。
文檔豐富，功能齊全，而且很容易使用和開發!而且是國產的喲!
以上排序是整理時的排序，一起整理分析一下，下次用的時候就不用到處找了，我想同樣的問題應該也存在在很多程序員身上，任何一款UI框架，只要能夠容易入手就行。
以上就是小編今天為大家分享的關於高質量web前端框架有哪些?的文章，希望本篇文章能夠對正在從事web前端工作的小夥伴們有所幫助。想要了解更多web前端知識的小夥伴們記得關注北大青鳥web培訓官網哦。
作者：qianankuangjia，來源：CSDN
原文：https://blog.csdn.net/qianankuangjia/article/details/78042944
G. web前端未來將會有什麼樣的發展趨勢
趨勢一：更加移動優先
響應式設計顯然是目前Web前端開發領域的主要趨勢之一，並且這一趨勢在未來還將持續一段時間。雖然現在的響應式設計大部分還是以PC版優先，然而如果有一天我們把PC版放到比移動版次要的位置上，也沒有什麼好奇怪的。因為，目前許多Web前端開發者已經開始轉向以移動優先方案來做他們的響應式設計和開發，這就象徵著一個重大轉變，值得我們跟進的。
趨勢二：更多使用快速原型開發工具
眾多Web前端開發者從2016年開始嘗試使用快速原型開發工具，而在2018年將是這種技術真正爆發的一年。「UXpin、Webflow、Invision以及其它許多快速原型開發工具，讓設計師不用寫一行代碼，就能為網站和服務快速創建低保真和高保真原型，便於設計師衡量它們的可用性和美觀性。」 Web設計師Jamie Leeson says如是說，「許多工具也允許你在瀏覽器中設計原型並從工具里真正啟動網站自身。」
不管未來前端發展方向如何，可以肯定的是未來前端人才需求依舊很大。想學前端開發專業的機構也很多，你可以去線下試聽課程了解一下，例如北大青鳥、南京中博軟體學院、南京課工場等等都有試聽課程的！
H. 如何自動化nginx負載 多個docker
Docker介紹Docker號稱是下一代的虛擬機，它在啟動和創建速度、性能、移植性等方面均優於傳統虛擬機。Docker是PaaS提供商dotCloud開源的一個基於LXC的高級容器引擎。它能夠讓開發者打包他們的應用以及依賴包到一個可移植的容器中，然後發布到任何流行的Linux機器上，也可以實現虛擬化。目前，通過Boot2Docker已能使Docker運行在Windows和OSX中。Docker容器完全使用沙箱機制，相互之間沒有任何介面。Docker幾乎沒有性能開銷，可以很容易地在機器和數據中心中運行。最重要的是,他們不依賴於任何語言、框架或系統。Docker在其網站上明確地提到的Docker的典型應用場景如下：對應用進行自動打包和部署創建輕量、私有的PAAS環境自動化測試和持續整合與部署部署和擴展Web應用、資料庫和後端服務在自動化測試領域，Docker大有取代傳統虛擬機技術的趨勢，原因如下：自動化測試依賴的是測試所需要的應用，而並非整個操作系統。因此，傳統的虛擬機技術存在資源浪費。Docker構建於LXC之上。藉助LXC輕量級的特性，相比於目前的虛擬機技術，Docker啟動更快、資源佔用更小。Docker比虛擬機輕量、靈活，便於管理。Docker標准化的構建方法(Dockerfile)和良好的RESTAPI，使得自動測試和持續集成/部署能夠很好的集成進來。回頁首Sahi介紹Sahi是一個開源的WebUI自動化測試框架。盡管它的知名度不及Selenium，用戶群也不及Selenium龐大，但它確有它獨特的魅力，例如：基於上下文的頁面元素識別機制。隱式頁面載入響應等待機制。良好的瀏覽器支持。優秀的跨瀏覽器錄制回放調試工具SahiController。這些特性都大大地加快了自動化測試腳本的開發速度，並降低了維護成本。Sahi通過一個用Java編寫的代理伺服器，將用戶的腳本轉換為JavaScript後注入往返的HTTP請求及響應中，從而驅動瀏覽器事件。編程語言方面，除Sahi腳本（其本質是一個JavaScript庫）以外，還支持Java和Ruby。Sahi有開源和收費兩個版本。雖然收費版本提供了很多開源版本不具備的高級特性，不過開源版本已經能夠滿足大部分的功能要求。點此查看開源版本與收費版本的差異。點此查看Sahi與其他Web自動化測試框架的對比。回頁首Jenkins介紹Jenkins是一種開源的基於Java開發的持續集成工具，前身稱作Hudson。Jenkins提供了用於監控持續重復工作的軟體平台。它支持豐富的插件，用戶可以按照需求進行選擇安裝和配置，以實現生成執行狀態表格，自動部署、更新自動化測試包等高級功能。本文將要介紹Jenkins的Docker插件，它能夠動態地創建Docker容器作為JenkinsSlave節點，並在執行任務後，自動關閉容器。另外，它還支持一些額外功能，比如當構建任務成功完成後自動將容器保存為鏡像、自動將鏡像上傳到資源庫等。回頁首實例演示該實例演示如何製作一個運行Sahi的鏡像以及如何在Jenkins上配置Docker插件以運行Sahi測試腳本。准備Docker鏡像本實例需要准備三個鏡像：一個運行Jenkins，一個運行Subversion，另外一個運行Sahi。首先，製作運行Sahi的鏡像。DockerHub是一個用於分享Docker鏡像的資源庫。目前，該資源庫還沒有運行Sahi的鏡像，所以必須自己創建Dockerfile來構建鏡像。下圖是用來製作Sahi鏡像的目錄。圖1.製作Sahi鏡像的目錄下圖是Dockerfile的文件內容。圖2.Dockerfile文件內容整個過程大體分為八個步驟：指定基礎鏡像我們使用的是evarga/jenkins-slave。該鏡像基於Ubuntu，安裝了SSH服務，並創建了用戶Jenkins。替換系統默認更新源。把系統更新源替換為163的，後面的軟體安裝速度會比較快一些。安裝必要的軟體（不包括OracleJava和Sahi）：Firefox,Unzip以及Xvfb。刪除OpenJDK是為了後面安裝OracleJava做准備。Firefox不用多說，因為該鏡像用於WebUI自動化測試，所以安裝了最新版本的Firefox。安裝Unzip是因為後面安裝Sahi需要用到它。Xvfb（Xvirtualframebuffer）是一個X11顯示伺服器的實現。它不是將圖形在屏幕上顯示出來，而是在內存中運行所有的圖形操作。對客戶端來說，除了無法看到真正的圖形顯示，沒有其他分別。一般稱這種運行方式為headless。安裝OracleJava8。理論上Sahi應當也支持OpenJDK，所以安裝OracleJava不是必須的。安裝Sahi。上傳了zip文件後，用Unzip解壓，Sahi是基於Java的，所以解壓後即已安裝好Sahi。之後，替換了幾個文件，它們的作用如下：Userdata.propertiesuserdata.properties中有個屬性叫proxy_alert.disabled，默認值為false。用戶第一次啟動SahiDashboard的時候，會彈出一個如下圖所示的對話框。用戶勾選了「Donoshowthismessageagain」並點擊Continue按鈕之後，Sahi修改該屬性值為true。之後就不會在跳出這個對話框了。由於用headless的方式運行Sahi無法點擊該對話框，所以必須事先用一個已將該屬性設置為true的文件替換Sahi默認的userdata.properties。圖3.Sahi代理問題對話框sahi_example_com這是一個證書文件。用戶第一次在SahiDashboard中打開Firefox時的頁面如下圖所示。用戶需要點擊SSLManager鏈接手動接受SSL證書。此時，文件sahi_example_com被生成到userdata/certs目錄下。之後，就不需要再進行該操作了。所以，復制的sahi_example_com目的也是為了自動完成這步需要在圖形界面下才能完成的操作。圖4.Sahi啟動頁圖5.SSLManager的非信任連接頁面browser_types.xml替換該文件是為了使Sahi以headless的方式工作。在該文件中，事先添加了一個名字為firefox-xvfb的瀏覽器配置信息。之後，測試腳本就可以指向該瀏覽器運行。具體配置Sahi和Xvfb的步驟參考。添加init.sh文件init.sh文件用於啟動Xvfb和Sahi。其內容如下。圖6.init.sh文件內容「sleep5」是因為Sahi啟動需要一點時間，若立即運行測試腳本會導致失敗。修改許可權最終運行的容器是作為JenkinsSlave節點用Jenkins用戶運行，因此將整個/usr/local目錄及子目錄的所有人修改為Jenkins，並給Shell文件添加執行許可權。Jenkins用戶是在基礎鏡像evarga/jenkins-slave中創建的，所以在這個Dockerfile里沒有創建Jenkins用戶的語句。指定默認執行的命令CMD["/usr/sbin/sshd","-D"]–該語句令鏡像默認啟動SSH服務。事實上，這條語句也可以不添加，因為evarga/jenkins-slave的Dockerfile中已包含該語句。一切就緒之後，在該目錄中執行「dockerbuild-tshenrui/sahi–rm=true」。命令成功執行後，通過「dockerimages」應當可以查看到名為「shenrui/sahi」的鏡像。該鏡像已經上傳到DockerHub，有需要的讀者可以自行拉取。Sahi鏡像構建好之後，接下來准備Jenkins容器。DockerHub上已有官方的Jenkins鏡像，直接用命令「dockerpulljenkins」拉取。在Docker主機上，創建一個目錄（例如，/data/jenkins_home），並修改許可權（chmod777）以便Jenkins容器能讀寫該目錄，然後用命令「dockerrun-d-t--namemyjenkins-p8080:8080-v/data/jenkins_home:/var/jenkins_homejenkins」啟動。此時，打開mitmysvn」把上面所做的修改保存下來創建一個新鏡像mysvn。最後，用命令「dockerrun-t-d-p3690:3690--namemysvnmysvnsvnserve-d--foreground-r/var/svn/repos」啟動mysvn容器。啟動時，添加容器到主機的埠映射「-p3690:3690」以便之後直接通過主機IP提交測試腳本。至此，Docker上有兩個正在運行的容器（dockerps），名字分別是myjenkins和mysvn。
I. web前端主流框架主要有哪些
1、Bootstrap
AUI是最近流行起來的，作者聲稱是專為APIClound設計的一套框架，解決了許多移動端開發實際中遇到的許多問題，是一個純CSS框架。使用容器+布局+模塊的構建方式，JS輔助，更自由更靈活更易於擴展使用。遵循Google Material設計規范，完美適配各個機型。面向HTML5，使用CSS3實現動畫交互，輕量級高性能。AUI是使用MIT License授權，你可以復制、出售。目前最新版本2.0。
8、Amaze UI
這是稱為妹子UI的開源框架，據稱是中國首個開源HTML5跨屏前端框架。妹子UI以移動優先為理念，從小屏逐漸到大屏，實現響應式網頁。Amaze UI包含20+個CSS組件、20+個JS組件，更有多個包含不同主題的Web組件。相比國外框架，妹子UI關注中文排版提供本地化支持。面向HTML5開發，使用CSS3來實現動畫交互，輕量級高性能。
9、Frozen UI
Frozen UI是一款開源，簡單易用，輕量敏捷的移動端框架。基於手Q樣式規范，目前全面應用於企鵝手Q增值業務中。基礎樣式效果簡單色調清爽，社區活躍，組件自然不少。包括按鈕、列表、表單、通知、提示條、彈出框、選項卡等等常用組件。還包括一個FrozenJs的JS組件庫。可以在主流的Android和IOS上應用。基本樣式使用離線包的方式減少請求提供快速接入方案。當然，根據網友反映，也存在大大小小的bug。不過總體來說，還是值得一用的。奇怪的是，Github上顯示的最後更新時間是一年前，難道已經沒人維護了嗎？
# Running this will show the space usage of each folder in the current directory.# The -h option makes the report easier to read.# -s prevents recursiveness and shows the total size of a folder.# The star wildcard (*) will run on each file/folder in current directory. -sh *1.2G Desktop4.0K Documents40G Downloads4.0K Music4.9M Pictures844K Public4.0K Templates6.9M Videos
還有一個相似的命令 df（Disk Free），使用df會返回有關可用磁碟空間的各種信息。