差别

这里会显示出您选择的修订版和当前版本之间的差别。

--- public:it:front-end [2017/02/15 09:58] – [online tools] oakfire
+++ public:it:front-end [2025/02/17 14:37] (当前版本) – [Frond-end] oakfire
@@ 行 1: / 行 1: @@
 ====== Frond-end ======
-<WRAP center round tip 60%>
+<WRAP center tip 60%>
   * XMLHttpRequest: [[http://stackoverflow.com/questions/16094248/how-to-set-date-header-for-http-request|xhr 不能添加 Date header！]], 浏览器端调试api要注意这个！！[[https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/setRequestHeader|MDN 详细说明]]
 </WRAP>
-  * [[.:html| HTML]]
+  * [[.:html]]
   * [[.:css | CSS]]
+  * [[.:Web_Developer_Security_Checklist|Web 开发者安全自检列表]]
+  * [[https://www.techempower.com/benchmarks/|Web Framework Benchmarks]]
   * [[https://github.com/JacksonTian/fks|前端技能汇总 Frontend Knowledge Structure]]
   * [[http://usablica.github.io/front-end-frameworks/compare.html | A Comparison of Frond-end frameworks]]
   * [[https://whatwebcando.today/|What web can do today]]
+  * [[https://rxdb.info/articles/websockets-sse-polling-webrtc-webtransport.html| web推送事件方式比较：WebSockets vs SSE vs WebRtc]]
+  * [[https://liveblocks.io/blog/which-rich-text-editor-framework-should-you-choose-in-2025#comparison-table|富文本编辑框架比较]]
 ===== DEBUG =====
-  * [[http://www.debuggap.com/|debuggap]]
+  * <del>[[http://www.debuggap.com/|debuggap]]</del>
   * [[http://www.uc.cn/business/developer/|UC debug]]
-==== online tools ====
+===== Online tools =====
   * [[http://jsfiddle.net/]]
+  * [[https://codesandbox.io/]]
   * [[http://rendur.com/]]
   * [[http://caniuse.com/|Can I use ...]] 查看 html,css 的某项特性在各浏览器环境是否可用。
+  * [[http://www.xiconeditor.com/|ICO 图标在线制作]]
+  * [[https://www.vectorizer.io/|img 转 svg 在线转换]]
+  * [[https://github.com/huglemon/inwind-landing-page| 落地页模板]]
+  * [[https://datavizcatalogue.com/search.html|可视化数据类型的选项]]
+===== Tips =====
+  * 浏览器视口(viewport)相对于屏幕的坐标位置的获取：
+    * 没有W3C标准。标准的''window.screenLeft''是浏览器窗口的屏幕坐标。
+    * firefox 可以通过 ''window.mozInnerScreenX'' 获取，非标准。
+    * 其它现代浏览器(chrome)需要用鼠标事件所带的 ''screenX'',''clientX'' 来计算。参考 https://github.com/rokmoln/browser-coords
+  * 浏览器捕捉屏幕: [[https://developer.mozilla.org/en-US/docs/Web/API/Screen_Capture_API/Using_Screen_Capture|MDN Screen capture]]
+    * ''navigator.mediaDevices.getDisplayMedia''
+    * [[https://developer.mozilla.org/en-US/docs/Web/API/MediaStream|MediaStream]]
 ===== LIB =====
   * [[http://placehold.it/|img 占位]]
   * [[http://fortawesome.github.io/Font-Awesome/examples/|Font Awesome]]
+  * [[https://github.com/tabler/tabler|tabler]]:一个基于 Bootstrap 的网页 UI 框架，专用于开发管理后台
 ==== Grunt ====
   * [[http://gruntjs.com| gruntjs.com]]
-==== Polymer ====
+==== Webpack ====
-  * [[http://polymer-project.org|polymer-project.org]]
+  * [[public:it:webpack]]
-  * [[https://github.com/Polymer/polymer|github code]]
+==== Polymer/LitElement ====
+  * <del>[[http://polymer-project.org|polymer-project.org]]</del>
+  * [[https://github.com/Polymer/polymer|github repo]]
+  * [[https://github.com/Polymer/lit-element]]
+  * [[https://lit-element.polymer-project.org/]]
 ==== angular js ====
-  * [[http://angularjs.org|angularjs.org]]
+  * v1.0: [[http://angularjs.org|angularjs.org]]
-  * [[http://angularjs.cn|angularjs.cn]]
+  * [[https://angular.cn/docs|angular.cn]]
+  * newest: [[https://angular.io/|angular.io]]
+  * [[angular]]
 ==== jquery ====
   * [[http://hayageek.com/jquery-ajax-form-submit/|jquery-ajax-form-submit]]