从去年起，我和知名技术专家侯策开始了合著之旅，今年我们共同打磨的书籍《React 状态管理与同构实战》终于正式出版了！在书籍定稿之际，我把底稿寄给了justjavac，感谢justjavac在百忙之中抽时间阅读了底稿，并为我写了推荐序，一下是推荐序的内容迷渡（justjavac）推荐序1995年，Brendan Eich花了10天时间开发出一门脚本语言，取名为Mocha，并将其集成到了Netscape浏览器中，不久后这门语言被改名为LiveScript，意思是可以让网页充满动力。同年年底，网景公司和SUN公司达成协议并获得了Java商标的使用权，于是正式将这门语言更名为JavaScript。历史选择了JavaScript，使其成为了目前浏览器唯一内置支持的语言。时至今日，JavaScript已经不仅仅局限于为网页开发实现特效了，而是真正发展成了一门全功能的编程语言。我从2005年开始接触网页开发，经历了Web开发的“上古时代”。在Web 1.0时期，我们开发出来的网页是给人“看”的，此时流行jQuery这种用来处理浏览器兼容性的库，以及像Dojo、YUI、Extjs这种用来做UI的库。随着计算机和浏览器性能的提升，JavaScript的功能开始不再局限于实现简单的网页开发，特别是Ajax的使用更是显著地提升了用户体验，这个时期被称为Web 2.0。站在开发者和使用者的角度，Web ...继续阅读 (59)

【摘要】前言 ECMAScript 6.0（以下简称 ES6）是 JavaScript 语言的下一代标准，已经在 2015 年 6 月正式发布了。它的目标，是使得 JavaScript 语言可以用来编写复杂的大型应用程序，成为企业级开发语言。 这句话基本涵盖了为什么会产生ES6这次更新的原因——编写复杂的大阅读全文 ...继续阅读 (12)

JS跨域跨域，指的是浏览器不能执行其他网站的脚本。 它是由浏览器的同源策略造成的，是浏览器施加的安全限制。JavaScript处于安全方面的考虑，不允许跨域调用其他页面的对象。http://debuginn.com/a.html调用http://debuginn.com/b.php （非跨域）http://debuginn.com/a.html调用http://baidu.link/b.php （跨域）http://debuginn.com/a.html调用http://a.debuginn.com/b.php （跨域）http://debuginn.com/a.html调用http://debuginn.com:81/b.php （跨域）http://debuginn.com/a.html调用https://debuginn.com/b.php （跨域）跨域解决方法一 — 代理跨域解决方法二 — JSONPJSONP用于解决主流浏览器的跨域数据访问的问题。JSONP技术仅仅支持GET请求，不支持POST请求。跨域解决方法三 — XHR2在HTML5中提供的XMLHttpREquest Level2已经实现了跨域访问以及其他的一些新功能IE10以下版本均不支持在服务器端做一些小的改造即可：header(‘Access-Control-Allow-Origin:*’);header( ...继续阅读 (44)

Ajax技术简介AJAX即“Asynchronous JavaScript and XML”（异步的JavaScript与XML技术），指的是一套综合了多项技术的浏览器端网页开发技术。Ajax的概念由杰西·詹姆士·贾瑞特所提出。传统的Web应用允许用户端填写表单（form），当提交表单时就向网页服务器发送一个请求。服务器接收并处理传来的表单，然后送回一个新的网页，但这个做法浪费了许多带宽，因为在前后两个页面中的大部分HTML码往往是相同的。由于每次应用的沟通都需要向服务器发送请求，应用的回应时间依赖于服务器的回应时间。这导致了用户界面的回应比本机应用慢得多。与此不同，AJAX应用可以仅向服务器发送并取回必须的数据，并在客户端采用JavaScript处理来自服务器的回应。因为在服务器和浏览器之间交换的数据大量减少，服务器回应更快了。同时，很多的处理工作可以在发出请求的客户端机器上完成，因此Web服务器的负荷也减少了。JSON技术JavaScript 对象表示法JSON用jQuery实现AjaxjQuery.ajax([settings])type：类型，“POST”或“GET”，默认为“GET”url：发送请求的地址data：是一个对象，联通请求的发送到服务器中的数据；dataType：预期服务器返回的数据类型。如果不确定，jQuery将自动根据HTTP包MIME信息来只能判断，一般 ...继续阅读 (35)

JSON基本概念JSON：JavaScript对象表示法（JavaScript Object Notation）JSON是存储和交换文本信息的语法，类似XML。采用键值对的方式来组织，易于人们阅读和编写，同时也有益于机器解析与生成。JSON是独立于语言的，不管是什么语言，都可以及逆行解析json，按照json规则来就行。JSON和XML对比JSON的长度相对于XML来说比较短小JSON读写速度比较快JSON可以使用JavaScript内建的方法直接进行解析，转换成JavaScript对象，十分的方便语法规则书写格式是：名称/值对名称/值对组合中的名称写在前面（在双引号中），值对写在后面（同样在双引号中），中间用冒号隔开，比如“name”:”张三” ...继续阅读 (36)

原文：https://javascript.info/class-inheritance 补档，首发于 segmentfault：https://segmentfault.com/a/1190000015565616 class 可以 extends 自另一个 class。这是一个不错的语法，技术上基于原型继承。 要继承一个对象，需要在 `{..}` 前指定 `extends` 和父对象。... ...继续阅读 (34)

最近两个项目同时开发，使用了Vue2的SSR，这样后端渲染页面首屏可以加快页面呈现，增加SEO和用户体验，但是项目上线后却发现了严重的性能问题，于是在三天内两次重大调整，最后只能放弃Vue SSR，本文从Vue SSR实现开始，逐渐复盘整个事件。两周前就预告了要写一篇Vue SSR的文章，但是没想到上周四上线之后，周六放量之后发现性能问题，这周一到周三，做了两次重大调整，最终还是放弃了SSR，并且做了这次事件复盘。技术选型调研Vue已经很久了，随着Vue2正式发布，使用Vue来做项目又燃起了希望，不是为了一时的技术理想和情怀（了解我的人都知道，我不是这样的人），主要是出于下面几方面考虑：用artTemplate+Sass+JS做的components方案已经做了很久了，沉淀了很多组件，随着Node服务开始上线，一直想在此基础上做同构，而公司Node框架Yog2的view层选择偏向于Smarty模板的Swig，修改比较麻烦既然改不了，那么要换不如直接选择新的components方案，这次最强烈需求是：组件化和支持SSR，而Vue2之后支持SSR这次两个项目同时进行，而且仅仅给两周的开发时间，组件化有效提高工作效率，可以把通用的组件抽象出来，多个页面之间业务组件复用率也很高，而且业务组件在后续的运营活动也可以直接复用手百产品形态复杂，页面即在手百内使用又有手百外使用，手百内页面被多个W ...继续阅读 (13)

上次文章介绍了Hybrid开发中常用到的Web和NA的通信方案：JSBridge，通过比较之后，最终推荐安卓和iOS通用的scheme协议，可以保证APP内和外都可以使用，今天开始正式介绍整个Hybrid架构内容。就像本系列「开篇语」提到的，这里的Hybrid是「狭义的Hybrid」，而不是所有的NA套个webapp就是Hybrid。好的架构不是随波逐流，应该经得起考研Hybrid技术体系是一套很多技术组成的完整知识架构。拿手百Hybrid方案，包括规范/约定、开发、联调、服务支撑等整个开发流程，而随着PWA之类「新」技术的产生又在考研技术架构面向未来的设计能力，所以手百Hybrid还在不断完善，注意是不断完善，不是推到重来！手百Hybrid技术整体架构如下：接下来系列会围绕本架构图中重要的部分依次展开，全面的介绍Hybrid开发知识，本文介绍模板本地化开发方案。所谓「模板本地化」，就是将Web页面内置到APP内，随版发布上线，然后通过云端接口实现更新，再直白一点：将H5网站的页面预先放到客户端发版，然后云端更新新版本。这个方案好处在于：本地化模板提高页面打开速度，减少用户等待时间模板可更新，版本控制更方便可控，收敛快Web页面和NA内置代码实现一套代码，减少开发成本上手成本小，开发就是实际开发Web（H5）页面，通过构建工具，生成Web页面和NA模板包不同的代码标准H5代码，迁 ...继续阅读 (10)

大上周文章提到了Hybrid的模板本地化解决方案，本文介绍下模板包的管理平台。管理平台功能模板包的管理平台主要功能包括：自动编译自动增量上传包推送下发提测小流量&灰度：按客户端id下发、小流量数据收集：收敛，速度，监控整体架构和流程图部分细节讲解通过git hook，当打tag的时候，会触发编译，编译完成后，会对接模板数据库，打出三个增量包（为什么三个，看「模板本地化」文章）回滚实际是重新拿上一个版本的全量包生成新的版本号和签名，然后入库模板包下发，可以根据客户端id（用户id）进行针对性下发，还可以根据IP地域、运营商、百分比等方式灰度下发，提测其实是定向的一种模板包下发日志和数据，都回传到日志系统，统一采集分析，生成数据报表模板收敛率统计有两种方法：模板下发接口统计的当前版本号数据模板代码请求业务方api获取数据，携带的模板版本号数据这两种方式统计的收敛率数据不一样模板包失败统计是通过客户端上报的，可以详细列出哪个环节问题，比如是下载问题？解压问题？还是签名校验失败？ ...继续阅读 (10)

拖稿了好久的「Hybrid APP开发系列」又更新了~今天继续写JSSDK为什么会有JSSDK我之前文章介绍了通过 JSBridge 实现页面和NA的相互调用，并且介绍了模板本地包的开发和后台维护系统。今天介绍的是JSSDK，通过 JSSDK 可以实现：抹平JSBridge的平台实现差异对齐端能力，内部消化版本差异sdk封装后的代码更加符合前端习惯权限控制、鉴权、对外开放，实现生态建设关于sdk的代码级别的设计，可以参考文章：《JSSDK设计指南》如果做过微信页面开发的，应该都知道wx.js，这就是微信的JSSDK，在微信内需要调用微信的端能力就需要引入这个js。JSSDK的设计JSSDK的设计包括两部分：随着每个NA客户端版本内置的js，称为：inject.js，他的主要作用是封装JSBridge逻辑，通过随版更新实现减少端能力的版本分裂，降低整个sdk的代码复杂性。inject.js是一段js代码，当客户端加载一个页面的时候，由客户端在适当的时机注入到webview内执行，执行后的代码就会有给webview增加js方法，例如微信的_WeixinJSBridge，类比chrome开发插件当中的content_scripts，可以在document_start、document_end等时机进行执行。云端JS，即实际暴漏给开发者使用的js，称为：jssdk.js，这个是真正开发者使 ...继续阅读 (14)

【摘要】简单轻量跨平台的 Javascript 运动引擎 Github → "https://github.com/dntzhang/cax/tree/master/packages/to" "Simple DEMO" "Animation DEMO" "Clip Transform Animation D阅读全文 ...继续阅读 (10)

Hybrid开发中，web页面往往会跟native进行交互，而JSBridge就是web页面和native进行通信的桥梁，通过JSBridge可以实现web调用native的方法，native可以通过webview.loadUrl之类的方法，将javascript:xxx代码放在页面执行，这有点类似在浏览器地址栏直接输入：javascript:xxx本文较长，先把目录列出来：JSBridge多种形式js Interface 直接注入到window对象改写浏览器原有对象：alert/console/promptURL scheme唤起APP技术intentlocalserverscheme：deeplink/applink/Universal linksmart app bannerJSBridge安全JSBridge的最佳实践协议规范回调函数预留升级/统计能力简单JSBridge调用封装JSBridge多种形式web和native进行通信，方法有很多，接下来一一列举一下JSBridge的多种形式，及其利弊。JavaScriptInterfaceJSInterface是安卓4.2-官方推荐的解决方案，原理是通过WebView提供的addJavascriptInterface方法给浏览器window注入一个命名空间，然后给Web增加一些可以操作Java的反射。// Android ja ...继续阅读 (9)

本文从业务场景来谈谈为什么选择Node，以及前端写后端代码需要补足的短板。这些日子一直在做Node方面的尝试，或多或少会收到周围的异样的目光甚至背后的质疑，于是促使我好好思考为什么我在做Node。网上搜下「为什么要用Node」，找到的文章多数是介绍Node多么多么牛逼，无非是从Node本身特性来说，比如：并发、事件驱动、非阻塞I/O、单线程、流、社区生态……诸如此类，很少谈业务场景。我是「实用主义」者，说过：脱离业务场景谈架构都是耍流氓。因为个人是从一线业务做起的，经过几年对业务的思考，我觉得可以从业务场景来说说为什么我们的业务更适合用Node。从业务场景说起现在我们的业务模块化越来越普遍，很少有业务比较纯粹只有链接一个数据库就可以搞定，往往前台业务后面会有N多的API服务做支撑。比如：下面两种情况在我们实际开发中经常遇见：某个页面需要的数据来自两个以上接口，而两个接口来自不同的团队/部门，比如：用户信息来自账号部门，而UGC数据来自业务部门某个页面存在接口依赖，需要先调用接口A，然后根据接口A数据调取接口B，比如：个性化推荐，往往需要根据某些维度请求推荐系统拿到推荐数据的ID，至于内容，需要拿ID根据页面需要去获取具体元数据上面两种情况，站在后台开发的角度来看，我们业务模块要分开要独立，而站在前端的角度来看，这些数据都是一个页面需要的，前端希望是一个接口给我返回。这是一个开始。。 ...继续阅读 (4)

前一段时间「这个仇我先记下了」的表情包突然火了，导致我也萌生了自己写一个表情包生成工具的想法，毕竟我是重度表情包玩家😌。其实之前我就很喜欢做表情包，不过是用的 PS 等软件，有些麻烦，而且改 GIF 也不太方便。于是乎，我决定也蹭一波热度，也写了一个，最初是只有「记仇」这个静态表情包的，现在加上了王境泽、为所欲为、打工是不可能打工的等等动图，模板后续还会添加，如果有好的素材可以私我。思路当然网上也有一些表情包生成器，比如「sorry」，但界面我不太喜欢，而且我觉得这类较为简单的处理没必要借助服务器端渲染合成，直接在浏览器端渲染就好了，毕竟 JavaScript 算是一门「万能的语言」。核心思路是采用 omggif 对 GIF 进行解码，再用 Canvas 将文字绘制在每一帧上，最后再用 gif.js 将每一帧合成，再渲染后输出成 Blob 文件对象（现在不支持 Blob 的浏览器应该没有了吧？），传递给 IMG 标签进行显示。这是解码过程：// 解码 let gifReader = new omggif.GifReader(buffer); // 获取帧 let frameZero = girReader.frameInfo(0) // 获取帧的宽高，绘制 Canvas 的时候会用到 let [width, height] = [frameZero.width, frame ...继续阅读 (55)

前一段时间「这个仇我先记下了」的表情包突然火了，导致我也萌生了自己写一个表情包生成工具的想法，毕竟我是重度表情包玩家😌。其实之前我就很喜欢做表情包，不过是用的 PS 等软件，有些麻烦，而且改 GIF 也不太方便。于是乎，我决定也蹭一波热度，也写了一个，最初是只有「记仇」这个静态表情包的，现在加上了王境泽、为所欲为、打工是不可能打工的等等动图，模板后续还会添加，如果有好的素材可以私我。思路当然网上也有一些表情包生成器，比如「sorry」，但界面我不太喜欢，而且我觉得这类较为简单的处理没必要借助服务器端渲染合成，直接在浏览器端渲染就好了，毕竟 JavaScript 算是一门「万能的语言」。核心思路是采用 omggif 对 GIF 进行解码，再用 Canvas 将文字绘制在每一帧上，最后再用 gif.js 将每一帧合成，再渲染后输出成 Blob 文件对象（现在不支持 Blob 的浏览器应该没有了吧？），传递给 IMG 标签进行显示。这是解码过程：// 解码 let gifReader = new omggif.GifReader(buffer); // 获取帧 let frameZero = girReader.frameInfo(0) // 获取帧的宽高，绘制 Canvas 的时候会用到 let [width, height] = [frameZero.width, frame ...继续阅读 (26)

【摘要】Qone 下一代 Web 查询语言，使 javascript 支持 LINQ Github： "https://github.com/dntzhang/qone" 缘由 最近刚好修改了腾讯文档 Excel 表格公式的一些 bug，主要是修改公式的 parser 。比如下面的脚本怎么转成 javasc阅读全文 ...继续阅读 (10)

起因大概在五天前，忽然发现一直在用的网易云解析不能用了，去作者的项目查看才知道原来是网易云更换了新的接口，旧接口的请求现在统一返回 403。于是乎，便萌生了自己写一个接口的想法。其实网易云的外链获取目前还是有几种可用方案，比如：云音乐直链生成器手动替换：https://music.163.com/song/media/outer/url?id=[].mp3，将中括号改为歌曲 id，即为外链这两种方法其实大同小异，都会 302 至歌曲的缓存地址，但也存在一个身为强迫症的我无法忍受的缺点——缓存地址的协议是HTTP（从云音乐官网现在还有大量的 Mixed Content 就可以看出网易对这方面并不上心），而且自己将协议修改成HTTPS后访问部分歌曲又会有机率出现 403，这可真是逼死我了现在第二个方法已经会直接 302 至 HTTPS 协议了。于是决定暂时放弃掉网易云，换其他家的顶着。我又用回了网易云接口，并编写了一个API 文档，欢迎使用。QQ 音乐考虑了一圈，还是决定选 QQ 音乐。在网上也找到了 QQ 音乐所提供的接口：请求地址：https://c.y.qq.com/base/fcgi-bin/fcg_music_express_mobile3.fcg参数，有三个：songmid：歌曲页 Url 的https://y.qq.com/n/yqq/song/[].html括号部分f ...继续阅读 (48)

起因大概在五天前，忽然发现一直在用的网易云解析不能用了，去作者的项目查看才知道原来是网易云更换了新的接口，旧接口的请求现在统一返回 403。于是乎，便萌生了自己写一个接口的想法。其实网易云的外链获取目前还是有几种可用方案，比如：云音乐直链生成器手动替换：https://music.163.com/song/media/outer/url?id=[].mp3，将中括号改为歌曲 id，即为外链这两种方法其实大同小异，都会 302 至歌曲的缓存地址，但也存在一个身为强迫症的我无法忍受的缺点——缓存地址的协议是HTTP（从云音乐官网现在还有大量的 Mixed Content 就可以看出网易对这方面并不上心），而且自己将协议修改成HTTPS后访问部分歌曲又会有机率出现 403，这可真是逼死我了现在第二个方法已经会直接 302 至 HTTPS 协议了。于是决定暂时放弃掉网易云，换其他家的顶着。我又用回了网易云接口，并编写了一个API 文档，欢迎使用。QQ 音乐考虑了一圈，还是决定选 QQ 音乐。在网上也找到了 QQ 音乐所提供的接口：请求地址：https://c.y.qq.com/base/fcgi-bin/fcg_music_express_mobile3.fcg参数，有三个：songmid：歌曲页 Url 的https://y.qq.com/n/yqq/song/[].html括号部分f ...继续阅读 (21)

今天看到一篇很有意思的文章：有没有考虑过ReactDom.render的第一个参数到底是什么？初看标题以为作者有什么重大发现，结果发现文章很短。看完我总结一下就是，作者从如下代码：ReactDOM.render(,document.getElementById('root'));推导出了实际上，ReactDOM.render的第一个参数就是一段 jsx。（为什么我觉得这是显而易见的呢？不就是一个 jsx 吗）作者得出一个结论：不管你在这放组件，元素，还是无状态组件，本质上都是在放一个JSX的语法大误！render函数的方法签名：ReactDOM.render(element,container[,callback])既然讨论类型，那不如看看强类型的 ts 对这个函数的类型定义：exportinterfaceRenderer{// Deprecated(render): The return value is deprecated.// In future releases the render function's return type will be void.(element:DOMElement,T>,container:Element|null,callback?:()=>void):T;(element:Array,any>>,container:Element|nul ...继续阅读 (35)

stackoverflow 有人提问：Does React keep the order for state updates?我知道 React 的状态更新是异步执行的，为了性能优化，状态是批量更新的。所以你永远不能确信在调用setState后状态是否更新了。但是你是否可以确认setState调用后状态的更新顺序呢？比如以下情况：相同的组件？不同的组件？考虑以下按钮点击的例子：是否有可能a是false，b是true?classContainerextendsReact.Component{constructor(props){super(props);this.state={a:false,b:false};}render(){return}handleClick=()=>{this.setState({a:true});this.setState({b:true});}}是否有可能a是false，b是true?classSuperContainerextendsReact.Component{constructor(props){super(props);this.state={a:false};}render(){return}}classContainerextendsReact.Component{constructor(props){super(props);this.s ...继续阅读 (18)

原文：Deep-copying in JavaScript - DasSur.ma如何在 JavaScript 中拷贝一个对象？对于这个很简单的问题，但是答案却不简单。引用传值在 JavaScript 中所有的东西都是引用传递。如果你不知道什么意思，看看下面的例子：function mutate(obj) { obj.a = true; } const obj = {a: false}; mutate(obj) console.log(obj.a); // 输出 true函数mutate改变了它的参数。在值传递的场景中，函数的形参只是实参的一个副本——a copy——当函数调用完成后，并不改变实参。但是在 JavaScript 这种引用传递的场景中，函数的形参和实参指向同一个对象，当参数内部改变形参的时候，函数外面的实参也被改变了。因此在某些情况下，你需要保留原始对象，这时你需要把原始对象的一个拷贝传入到函数中，以防止函数改变原始对象。浅拷贝：Object.assign()一个简单的获取对象拷贝的方式是使用Object.assign(target, sources...)。它接受任意数量的源对象，枚举它们的所有属性并分配给target。如果我们使用一个新的空对象target，那么我们就可以实现对象的复制。const obj = /* ... */; const copy = ...继续阅读 (27)

CNPM 是一个可以提供 npm 私有化部署的开源方案。它提供了 JavaScript 模块的存储、发布和下载，以及一个用于在线浏览的 Web 界面。为什么需要私有 npm官方的npm可以说是最大的 JavaScript 模块仓库，大约有 60 多万个开源的 JavaScript 模块。那为什么我们还需要一个私有 npm 仓库呢？总结起来，有以下几点原因：保证 npm 服务的快速、稳定。由于国内网络环境的原因，从官方 npm 上安装模块依赖时，可能需要花费很长的时间。在部署私有 npm 后，可以把经过审核的 npm 模块加入到私有仓库，这样在开发环境和生产环境中就可以对模块进行快速安装了。另外还能避免类似 left-pad 事件的发生1。发布私有 npm 模块。官方 npm 上的模块全部是开源的，然而在实际开发过程中，我们需要将一些可复用的功能封装成模块供团队内部使用，而又不希望公布并上传到官方的 npm。快速部署 CNPM首先从 GitHub 上将源代码下载到本地：$git clone https://github.com/cnpm/cnpmjs.org.git$HOME/cnpmjs.org创建一个 MySQL 数据库实例，并将 CNPM 源码中的 SQL 导入：mysql>create database cnpmjs;mysql>use cnpmjs;mysql>source ...继续阅读 (24)

很久没写教程啦，说好的手机模板开发也拖到前天才开始（虽然核心之前写了），可想而知不是一般的忙。至于赚了多少钱嘛就不提了，都是泪。所以还是分享下这次的经验吧。由于需要开发手机模板，把搜索和菜单做成一个类似微信的模式，于是乎如下图。是不是很棒棒，感觉自己帅帅哒。点搜索会进入输入框，也可以切换回来。但是，，，点击输入框后会弹出输入法，如果用微信，QQ浏览器发现没问题，可是夸克浏览器（UC旗下）就有问题了。出现如下图界面。。。一看就知道兼容问题啦。我先贴一下样式代码。大概如下：#search{display:block;height:48px;z-index: 10;position:fixed;bottom:0left: 0;}可是这种兼容问题挺尴尬的，一方面我越来越少写前端了，另一方面这种在手机上才能模拟的现象一时半会不知道怎么调试，由于周末出差，于是搁置先忙其他。今天下午想着不行啊这个必须解决才有动力继续下去。搜索了很多资料，方法都试了不可行。不过有一个方案倒是不错。如下： 但是我发现这一样行不通，于是我在想，能不能判断下，来定义bottom？ennnnnn，不对，定义top？于是乎：varwinHeight = $(window).height();//获取当前页面高度$(window).resize(function() {varthisHeight = $(this).heig ...继续阅读 (19)

In number theory, aright-truncatable primeis a prime number which, in a given base, contains no 0, and if the last (“right”) digit is successively removed, then all resulting numbers are prime. 7393 is an example of a right-truncatable prime, since 7393, 739, 73, and 7 are all prime.–WikipediaIn this essay, we’re going to write some code to generate truncatable primes. Along the way, we’ll get some practice working with JavaScript generators implmenting lazily generated lists, we’ll get a chance to look at some of the ways a naïve algorithm might have terrible runtime performance, and we’ll ge ...继续阅读 (25)

In number theory, aright-truncatable primeis a prime number which, in a given base, contains no 0, and if the last (“right”) digit is successively removed, then all resulting numbers are prime. 7393 is an example of a right-truncatable prime, since 7393, 739, 73, and 7 are all prime.–WikipediaIn this essay, we’re going to write some code to generate truncatable primes. Along the way, we’ll get some practice working with JavaScript generators implmenting lazily generated lists, we’ll get a chance to look at some of the ways a naïve algorithm might have terrible runtime performance, and we’ll ge ...继续阅读 (28)

【摘要】本文介绍我开发的一个JavaScript编写的插件化框架——minimajs，完全开源，源码下载地址：https://github.com/lorry2018/minimajs。该框架参考OSGi规范，将该规范定义的三大插件化功能在Node上实现了。MinimaJS三个功能：动态插件化，服务和扩展。阅读全文 ...继续阅读 (7)

昨天，WordPress #core-js Slack 频道进行了一场活跃的技术讨论会议，讨论的重点不再是具体框架之间的比较；而是在未来 WordPress 的基于 Javascript 的界面构建中，框架所能扮演的角色，发挥的作用。参加会议讨论的包括有 WordPress 核心开发人员，React 社区、Vue 社区的核心开发人员和领导人，Chrome 工程师，以及 WordPress 社区之外其他感兴趣的人员。在WordPress 决定放弃 React事件之后，Facebook 宣布重新授权 React 并放弃专利。之后，Matt 在其博客上发表文章称，React 仍然是 WordPress 团队的选项之一。这次会议由 Andrew Duthie 主持。他首先询问了框架在 WordPress 开发者的工作流程中所发挥的作用，并要求框架贡献者提供关于可扩展接口的建议。古腾堡（Gutenberg）项目负责工程师 Matías Ventura 说，他不认为 WordPress 核心选取的 js 框架会成为插件开发的实际标准。插件开发人员的实际标准是 WordPress 公开的 API 接口。通过框架无关的构建古腾堡块（Gutenblocks）方法，核心框架不必成为开发人员的事实标准。但是外部的 Gutenberg 团队认为，这样的结局是不可避免的。有的团队正在等待 WordPress ...继续阅读 (17)

XSS’OR 开源了。采用 BSD 开源协议，很宽松，不限制传播与商业化，留下作者版权就好。在下面这个 GitHub 页面上，你不仅可以得到 XSS’OR 的源码，还可以了解如何自己搭建一个。https://github.com/evilcos/xssor2简单说明下：上线之后（xssor.io），使用频率还不错。源码是 Python 及 JavaScript，采用了 Django、Bootstrap、jQuery 三个优秀框架，可以完整覆盖前后端，基于这三个框架，开发速度非常的快，整个过程消耗我不到一周时间，其中一半耗时在软件设计上。感兴趣这个过程的，可以读这套源码，很简洁，在开发过程中我特意去掉数据库（因为我觉得我这个应用场景其实不需要数据库）。既然开源了，后续应该会和新组建的 ATToT 安全团队一起去完善它。XSS’OR 信息量不小，如果你也玩前端黑，好好玩^_^。 ...继续阅读 (10)

添加一个iframe, 内容是Github free-programming-books, 优先保存一下中文书籍.more目录语言无关IDEMySQLNoSQLPostgreSQLWebWEB服务器其它函数式概念分布式系统在线教育大数据操作系统数据库智能系统正则表达式版本控制程序员杂谈管理和监控编程艺术编译原理编辑器计算机图形学设计模式软件开发方法项目相关语言相关AndroidAWKCC#C++CoffeeScriptDartElasticsearchElixirErlangFortranGolangHaskellHTML / CSSHTTPiOSJavaJavaScriptLaTeXLISPLuaMarkdownNode.jsPerlPHPPythonRreStructuredTextRubyRustScalaSchemeShellSwiftVimVisual Prolog语言无关IDEIntelliJ IDEA 简体中文专题教程MySQL21分钟MySQL入门教程MySQL索引背后的数据结构及算法原理NoSQLDisque 使用教程Neo4j .rb 中文資源Redis 命令参考Redis 设计与实现The Little MongoDB BookThe Little Redis Book带有详细注释的 Redis 2.6 代码带有详细注释的 Redis 3.0 代码Postgr ...继续阅读 (10)

上个月底，在朋友圈看到一个号称“这可能是地球上最美的h5”的分享，点进入后发现这个h5还很别致，思考了一会，决定要不高仿一个?到今天为止，高仿基本完成，线上地址github地址除了手机端的media控制没有去兼容，其他的基本都给仿了。 那为了让你觉得是高仿，最好使用chrome的手机调试模式进行访问。微信打开将听不见声音看不到视频... （后面再有时间看是不是仿的再进一步）之所以要仿它，因为觉得这个h5还挺酷，想看看自己需要花多长时间找到并实现它的技术路径。需求分析这个h5的主要玩法很简单：地球自转的时候会播放背景音乐（比如海浪声），为了找到这个声音是从哪个地球上哪个地方传来的，需要长按下方的按钮，这时地球会自动转动到目标地点，然后镜头拉近，穿过云层，最后你会看到和这段声音相关的视频内容；松开手之后，上面的过程会倒退回去，地球又开始自转，播放着下段神秘的背景音乐。个人觉得这个设计还是很新颖的，不是说用了3D的效果，而是将一个看起来很复杂的动画（从宇宙拉近到地表的过程），使用最基础的3D效果和其他一些常规的动画手法去实现，并且能流畅的运行在手机浏览器上。另外还有声音和视频的完美搭配，用户体验不错。反复观察，理清页面功能：加载：加载进度百分比，饶椭圆轨道运行的小行星作为loading动画（这个动画我没有做）地球：3D球体，旋转入场动画，自转，漂移的云层，城市的坐标点，镜头的旋转与拉近， ...继续阅读 (33)