查看详情
如何免费阅读 Medium 文章
Step1: 下载 Chrome 浏览器; Step2: （跨过山和大海）后打开浏览器，浏览 Medium ,然后打开你想阅读的文章；你可能会看到下面提示； step3: 没关系，接下来，你可以使用无痕模式，打开 Chrome 的无痕模式，然后将 url 粘贴进去就行了。 温馨提示: 如果有能力可以付费订阅的还是可以尽力付费 每月5刀，也不是很贵，也算是鼓励创作者。 详情 »
查看详情
AR/VR 显示技术原理 (下)
原文地址: https://medium.com/hackernoon/fundamentals-of-display-technologies-for-augmented-and-virtual-reality-c88e4b9b0895 @Kore 之前在AR/VR 显示技术原理-上篇翻译过关于人类视觉基本原理和对于空间的理解，这一部分主要翻译现有显示技术的硬件和底层材料使用。 显像技术 图像显示技术在过去一些年发展的极为迅速。高端的 CRT 已经被四种主要的技术所取代: 液晶显示器(LCD) LCD在高清电视中很常见，并且自1980年代以来一直用于AR/VR显示器中。这种显示类型由包含液晶分子的单元阵列组成，该单元夹在两个偏振片之间。这种装置安置于在于数百万个晶体管的薄玻璃基板之间。对于彩色LCD，将包含红色，绿色和蓝色滤光片的附加基板，放置在该基板的每个单元上方。单个RGB液晶单元称为子像素。三个子像素形成一个像素。 电流流过玻璃材料，改变电流可以使LCD调节光的通过以产生精确的颜色。如果所有子像素都完全打开，则会产生白光。 液晶单元不发光，需要背光。液晶单元只能改变光的通过以产生所需的颜色并随后产生图像。 发光二极管（OLED） 此显示技术基于有机（碳和氢键结合）材料，当施加电流时会发光。这是一种固态显示技术，其中通过有机片的能量以光的形式释放，也称为电致发光。可以通过仔细设置有机发光来控制颜色，但是大多数制造商在OLED堆栈中添加了红色，绿色和蓝色薄膜。OLED面板有两种类型： 被动矩阵有机电激发光二极管（PMOLED）： 与CRT一样，此显示类型由复杂的电子网格组成，以按顺序控制每行中的各个像素。它不包含使更新速度变慢并且保持像素状态高功耗的存储电容器。 详情 »
查看详情
《转》着色器语言 GLSL (opengl-shader-language)入门大全
基本类型 void 空类型,即不返回任何值 bool 布尔类型 true,false int 带符号的整数 signed integer float 带符号的浮点数 floating scalar vec2, vec3, vec4 n维浮点数向量 n-component floating point vector bvec2, bvec3, bvec4 n维布尔向量 Boolean vector ivec2, ivec3, ivec4 n维整数向量 signed integer vector mat2, mat3, mat4 2x2, 3x3, 4x4 浮点数矩阵 float matrix sampler2D 2D纹理 a 2D texture samplerCube 盒纹理 cube mapped texture 详情 »
查看详情
Getting Started with vue-core-video-player to create video player
I have focused on the video player in the last few years. With the growth of video content and bandwidth, so many websites using video to give users more information. So I hope this vue.js plugin helps you solve it. vue-core-video-player is a lightweight video player for Vue.js. It is easy to get started. 详情 »
查看详情
使用 chrome://media-internals 更好的进行音视频 Debug
随着短视频和在线教育办公的兴起，我们非常倚重浏览器的音视频项目开发。 Chrome 提供了一款非常好的内部状态栏，帮助我们去了解当前音视频的编码，buffer 状态等信息。 我们可以随机打开两个在线视频播放网站比如: https://www.bilibili.com/bangumi/play/ep313573 https://v.youku.com/v_show/id_XMzQ2OTk2Mjky.html 然后我们可以在浏览器新建 tab 输入 chrome://media-internals/ 我们可以看到四个 tab Players 当前播放视频的日志信息 Audio 当前音频的播放日志信息 Video Capture 当前摄像头的状况 Audio Focus 当前音频播放的 Session 其中我们主要关心前两个 Tab。 在 Players 我们是一个看到一个历史纪录，我们可以根据视频的 CDN 源找到当前正在播放的视频。然后点击，最底部我们可以在最底部看到两栏，Player Properties 和 Log。 详情 »
查看详情
[转]10种常见的软件架构模式
原文地址: https://www.cnblogs.com/IcanFixIt/p/7518146.html Tips 原文作者：Vijini Mallawaarachchi 原文地址：10 Common Software Architectural Patterns in a nutshell 有没有想过要设计多大的企业规模系统？在主要的软件开发开始之前，我们必须选择一个合适的体系结构，它将为我们提供所需的功能和质量属性。因此，在将它们应用到我们的设计之前，我们应该了解不同的体系结构。 什么是架构模式？ 根据维基百科中的定义： 架构模式是一个通用的、可重用的解决方案，用于在给定上下文中的软件体系结构中经常出现的问题。架构模式与软件设计模式类似，但具有更广泛的范围。 在本文中，将简要地解释以下10种常见的体系架构模式，以及它们的用法、优缺点。 分层模式(Lyered pattern) 客户端-服务器模式(Client-server pattern) 主从设备模式(Master-slave pattern) 管道-过滤器模式(Pipe-filter pattern) 代理模式(Broker pattern) 点对点模式( 详情 »
查看详情
terraform aws_lb_listener 配置详解
terraform 是一款通过代码来组织基础架构的工具。 Use Infrastructure as Code to provision and manage any cloud, infrastructure, or service 如果你是用的 AWS 的整套服务，你可以通过它实现对 S3, ECR, web load balancer 等服务的配置。当然它除了支持 AWS 也支持 阿里云 Google Cloud 等平台。非常适合不需要太多运维知识的工程师。 今天主要是我们需要配置域名和应用的绑定。比如我们部署了某个 Web 服务，实现域名和应用的关联，我们需要用到 aws_lb_listener 官方有提供一段参考，类似这样的: resource "aws_lb_listener_rule" "static" { listener_arn 详情 »
查看详情
JS 的原地(in-place)算法实践
In computer science, an in-place algorithm is an algorithm which transforms input using no auxiliary data structure. However a small amount of extra storage space is allowed for auxiliary variables. The input is usually overwritten by the output as the algorithm executes. In-place algorithm updates input sequence only through replacement or swapping of elements. An algorithm 详情 »
查看详情
聊聊 Web 视频播放的画中画模式
Chrome 在升级到 70 的时候开始对视频播放的画中画模式开始支持了，用户在浏览器 Web 页面可以通过 画中画的形式强当前画面停留在屏幕正上方，无论你在使用其他软件还是切到其他 Tab ，都可以看到当前画面。 最新的 caniuse 我们可以看到已经覆盖了很多了浏览器版本，包括 最新的 Safari 甚至移动 Android 的 Chrome 浏览器。 特征检测 我们可以通过 video 元素上的 requestPictureInPicture 的方法以及 document.pictureInPictureElement 来判断浏览器是否支持画中画模式。 if ('pictureInPictureEnabled' in document) { // do something } else { // not support } if (typeof videoEl.requestPictureInPicture === 'function') { // do something } else { // not support } API 调用 我们可以通过调用 requestPictureInPicture 来实现画中画播放模式。 someBtn. 详情 »
查看详情
【译】Web 视频播放前前后后
这应该是目前写的最为完整的关于 Web 视频播放的文章。从简单的 Video 元素到 MSE 直播的应用，作者给出了具体的代码，文章由浅入深，普及现代 Web 播放技术的前前后后。五星推荐阅读。 @Paul Berberian 原文地址: https://medium.com/canal-tech/how-video-streaming-works-on-the-web-an-introduction-7919739f7e1 注意：本文是JavaScript视频流的介绍，主要针对Web开发人员。这里的大部分示例都使用HTML和现代JavaScript（ES6）。如果您对它们还不够熟悉，那么您可能会发现很难继续学习，尤其是代码示例。 原生视频 API 从2000年代初期到后期，网络上的视频播放主要依靠Flash插件。 ** 警告用户安装Flash插件 ** 这是因为当时没有其他方法可以在浏览器上流式传输视频。作为用户，您可以选择安装Flash或Silverlight之类的第三方插件，还是根本无法播放任何视频。 为了填补这个空白，WHATWG 开始研究 HTML 标准的新版本，其中包括本地的视频和音频播放。苹果公司在其产品上禁用 Flash 后，这一趋势更加明显。而该标准后面成为现在的 HTML5 的标准。 因此，HTML5除其他新的标签外，将 < 详情 »