班会第 43 期

[ufologist]

• 技术

  • Indeterminate Checkboxes

    checkbox 有几种状态?

    • checked
    • unchecked
    • indeterminate

    

    var checkbox = document.getElementById('some-checkbox');
    // You can't make a checkbox indeterminate through HTML.
    // It is a property of checkboxes though, which you can change via JavaScript
    // The indeterminate state is visual only
    // Like the checkboxes themselves, indeterminate state looks different in different browsers
    checkbox.indeterminate = true;

  • 微信去除"防欺诈盗号请勿支付"或"输入qq密码以及防欺诈或盗号，请不要输入qq密码"的方法

    

    • 只有已经通过微信认证的账号可以去除这个提示
    • 在业务域名设置中，设置通过备案的域名

  • 前端模块系统

    前端开发和其他开发工作的主要区别，首先是前端是基于多语言、多层次的编码和组织工作，其次前端产品的交付是基于浏览器，这些资源是通过增量加载的方式运行到浏览器端，如何在开发环境组织好这些碎片化的代码和资源，并且保证他们在浏览器端快速、优雅的加载和更新，就需要一个模块化系统，这个理想中的模块化系统是前端工程师多年来一直探索的难题。

    模块系统的演进

    模块系统主要解决模块的定义、依赖和导出

    • <script>标签: 全局/冲突/依赖关系
    • CommonJS: 同步加载
    • AMD: 提前执行/依赖前置
    • CMD: 依赖就近/延迟执行
    • UMD: 语法糖, 模块定义的跨平台解决方案
    • ES2015模块: JavaScript 语言层面的模块体系定义

    期望的模块系统

    兼容多种模块风格，尽量可以利用已有的代码，不仅仅只是 JavaScript 模块化，还有 CSS、图片、字体等资源也需要模块化。

    前端模块加载

    • 前端模块要在客户端中执行，所以他们需要增量加载到浏览器中
    • 模块的加载和传输的两种极端方式, 这两种方式都不是好的解决方案, 它们过于简单粗暴
      • 每个模块文件都单独请求: 造成了请求次数过多，导致应用启动速度慢
      • 所有模块打包成一个文件然后只请求一次: 导致流量浪费、初始化过程慢
    • 分块传输, 按需进行懒加载, 在实际用到某些模块的时候再增量更新, 才是较为合理的模块加载方案
    • 要实现模块的按需加载, 就需要一个对整个代码库中的模块进行静态分析、编译打包的过程
    • 所有资源都是模块
      • 在前端开发过程中不仅仅有JavaScript模块文件, 还涉及到样式、图片、字体、HTML 模板等等众多的资源, 这些资源还会以各种方言的形式存在

  • 微信小程序解决方案 - 腾讯云

    • 一键自动完成域名的注册解析以及云端资源的分配初始化，快速搭建具备云端能力的专属小程序
    • 针对鉴权及WebSocket通信等特性，提供会话管理及WebSocket信道等服务帮助开发者高效完成小程序开发
    • 原生支持HTTPS/WSS，配备BGP高防，域名智能解析及防劫持等多重安全防护体系，为小程序保驾护航

    

    • 小程序配置指引、升级方案
    • 单机版架构升级
    • 集群版架构扩容

    微信小程序云端解决方案探索之路

    Wafer 快速构建具备弹性能力的微信小程序

    • Wafer 的全称是 Weapp Application Fullstack Essential Resources，即微信小程序全栈基础资源。
    • Wafer 是腾讯云面向广大开发者提供的小程序开发全栈资源套件，套件提供小程序会话管理服务和 WebSocket 信道服务，部署方式具备良好的弹性伸缩能力，可以快速应对业务的爆发增长，同时具备较低的开发门槛。

  • 不一样的技术创新: 阿里巴巴2016双11背后的技术 电子书

    2016天猫双11全球狂欢节活动圆满落幕，来自全球的消费者一共创造了1207亿的成交额

    在双11零点开始的半个小时里，超过6千万的用户使用手机来同时参与了这次活动，在零点的流量高峰，创造了每秒交易峰值17.5万笔，每秒支付峰值12万笔的新纪录

    而2009年的第一次双11，交易峰值仅为400笔每秒，支付峰值仅为200笔每秒

    双11是阿里技术团队的大练兵，双11后每个技术团队都会进行总结复盘，我们从中汇总了八个技术领域的经验总结，形成本书，希望能让各位读者全面地了解双11背后阿里技术

    全面阐述了双11背后的技术实践与创新，包含基础设施、存储、中间件、云计算、业务架构、大数据、人工智能、交互技术

    • 揭秘如何在大促场景对前端的极限挑战下，直播实现首屏秒开，以及应用世界级开源跨平台移动开发工具Weex实现双11会场几近全覆盖，实现全网首屏渲染和秒开？
      • 2016双11前端突破
      • Weex 双11会场大规模应用的秒开实战和稳定性保障

• 产品

  • 微信小程序设计指南

    • 重点突出
      • 每个页面都应有明确的重点，以便于用户每进入一个新页面的时候都能快速地理解页面内容。在确定了重点的前提下，应尽量避免页面上出现其它与用户的决策和操作无关的干扰因素。
    • 流程明确
      • 为了让用户顺畅地使用页面，在用户进行某一个操作流程时，应避免出现用户目标流程之外的内容而打断用户。
    • 导航明确，来去自如
      • 微信导航栏
      • 页面内导航
    • 减少等待，反馈及时
      • 页面下拉刷新加载(在微信小程序内，微信提供标准的页面下拉刷新加载能力和样式，开发者无需自行开发)
      • 页面内加载反馈
        • 模态加载
        • 局部加载反馈
        • 若载入时间较长,应提供取消操作,并使用进度条显示载入的进度。
        • 载入过程中,应保持动画效果 ; 无动画效果的加载很容易让人产生该界面已经卡死的错觉。
        • 不要在同一个页面同时使用超过1个加载动画。
      • 对于页面级操作结果，可使用弹出式提示（Toast）、模态对话框或结果页面展示
    • 异常可控，有路可退
      • 表单出错: 表单报错，在表单顶部告知错误原因，并标识出错误字段提示用户修改
    • 减少输入
    • 避免误操作
    • 视觉规范
      • 字体规范
      • 字体颜色
      • 列表视觉规范
      • 表单输入视觉规范
      • 按钮使用原则
      • 图标使用原则