Options 勾選 Faster Screen Updates
Connection List
vnc options 勾選Scale Remote Screen
解析度會降低，因ｉｐｈｏｎｅ預設的解析度都很高，所以在錄前就要決定要不要開這個模式，
否則之後開圖片會抓不到Q_Q
星期一, 7月 26, 2021
星期日, 7月 25, 2021
[CSS] 實作不對稱設計（Asymmetrical Designs）
透過ｃｓｓ的語法可以實作各式的不對稱DIV區塊，
使用Pseudo-Elements或Clip-Path都可以達成
可以讓網站的設計不用特別請設計師輸出圖片。
最後透過 CSS clip-path maker 這個網站工具就更操作直覺了
https://www.viget.com/articles/angled-edges-with-css-masks-and-transforms/
https://medium.com/@RoseLGauthier/how-to-use-css3-pseudo-elements-to-create-asymmetrical-designs-f610f2a481ed
http://jsfiddle.net/948ud6f7/
４０種以上常見圖形
https://css-tricks.com/the-shapes-of-css/
星期日, 7月 18, 2021
[Eggplant] 有效提升搜尋的準確度與速度
減少搜尋整個畫面是可以提升Eggplant Functional在搜尋目標（Text/Search）的速度，
可動態的去改變SearchRectangle的範圍即可。
以下記錄常用的方式
星期六, 7月 17, 2021
[Eggplant] Functional | 基本指令記錄－常處理商業邏輯會用到的
記錄每次錄製都會再查一下的指令集
List 操作
取list某個值
put ["cheddar","provolone","brie","muenster","mozzarella"] into CheeseListput item 1 of CheeseList // displays "cheddar"
如果要插入值進list
insert testScript after failTestScripts
[Eggplant] Functional常見問題 | 連線裝置解析大小不一致的問題？
在透過連線受測裝置iphone裝置時，常會有解析度不一樣的尺寸發生？會造成以下問題：
1. 有辦法強制設定解析度大小？或
2. 解析度是不會影響錄製？目前覺得錄製大解析度擷圖與電腦會比較花費效能
1125X2436
307X460
星期一, 7月 12, 2021
GA4 自訂事件｜ga.js / gtag.js
REF
https://support.google.com/analytics/answer/10106774?hl=zh-Hant&ref_topic=10737980
https://support.google.com/analytics/answer/9234069
Gtag.js教學
https://developers.google.com/analytics/devguides/collection/gtagjs/events
星期日, 7月 11, 2021
PageSpeed調校: core web vitals
記錄一下調校Pagespeed的一些現像
處理掉破圖的連線圖片，避免畫面loading等待
Google Fonts載入優化
用Cloudflare Business CDN載入速度比用cdnjs.cloudflare.com的慢一些
Cloudflare Business CDN 80ms
cdnjs.cloudflare.com CDN 58ms
第三方函式庫只在行動裝置被掃到扣分
星期四, 7月 08, 2021
[Eggplant] Functional 關閉預設的執行錯誤alert視窗
如果想要在執行eggplant functional錯誤提示訊息框，避免中斷測試，可以至偏好關閉(Prefermance )
Alert user when script execution fails: Selected by default. Select this checkbox to see an alert dialog box when a script fails. (This option does not apply to scripts that are run as part of a schedule.)
REF:
http://docs.eggplantsoftware.com/ePF/using/epf-general-preferences.htm
WebFont使用方式： 包含font-weight/swap
如何透過WebFont加載字型
WebFont.load({
timeout: 2000,
google: {
families: ['Noto Sans TC:100,300,500,700,900&display=swap', 'Roboto&display=swap']
}
});
再加上以下優化CVS效能
<link rel="dns-prefetch" href="//fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
如果你想用引用的方式也可以使用下面的語法
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@100;300;400;500&display=swap" rel="stylesheet">
Ref:
https://github.com/typekit/fvd
https://github.com/typekit/webfontloader/issues/429
星期三, 7月 07, 2021
各種所見即所的的開源編輯器蒐集 WYSIWYG HTML editor
做解決方案的case常需要找編輯器來套用。
畢竟做一個編輯器大到可以是一整間公司來開發產品，
蒐集一下一些免費的開源編輯器工具。
https://summernote.org/
個人最愛，但目前缺點是表格的支援度不夠好(有找到外掛，但目前遇到升級有bug)，https://grapesjs.com/
web builder framework 可以做整個網頁等級的編輯器XD
線上電商平台類似的網頁編輯器，有大量元件可以使用
https://editorjs.io/
Next generation block styled editor.Free. Use for pleasure.
新潮的區塊編輯器，將編輯器的結果存成json格式，這樣後端就很好存到ｄｂ