ssr

Headless Chrome: an answer to server-side rendering JS sites

原文:https://developers.google.com/web/tools/puppeteer/articles/ssr#inline TL;DR: 无头模式的 Chrome(Headless Chrome) 可以成为将动态 JS 站点转化成为静态 HTML 页面的入门工具。在 Web 服务器上运行它能够让你预渲染任何具备任何现代 JS 特性的页面,使得页面内容加载更快而且可以被爬虫工具索引到。 这篇文章的技术方案为大家展示了如何使用 Puppeteer 的 API 来为一个

  • serenader
    serenader
22 min read
javascript

JavaScript Promises 初探

在 Promise 产生之前的 JavaScript 一说起 JavaScript,给人印象最深的,应该是活在浏览器里面的各种各样的脚本了。但是如今 Node.js 发展非常迅速,npm 社区也非常活跃,因此也越来越多人关注后端的 JavaScript 。 不得不说,在 JavaScript 里面,事件绑定以及事件处理是一个非常重要的部分。 前端部分,诸如鼠标点击事件的绑定,以及键盘按键的绑定,以及和后台打交道的 Ajax 等,都使用到了事件机制。 最简单的一个点击事件如下: var target = document.getElementById(

  • serenader
    serenader
19 min read
javascript

JavaScript Trick (1)

1. 立即执行匿名函数 !function () { // code goes here }(); +function () { // code goes here }(); ~function () { // code goes here }(); 分析 以上代码作用都是声明一个匿名函数,并且立即执行。最常见的立即执行匿名函数的写法是: (function () { // code goes here })(); 先来解释一下这个常见的立即执行匿名函数的原理。 整个代码块其实可以这样分析: ( function () { } )() 其实就是看成是两对括号,然后一个匿名函数放在第一对括号里面。当 JavaScript 解释器遇到一对括号 () 的时候会把里面的内容解释成一个表达式。于是乎,括号内的匿名函数就先被执行了。

  • serenader
    serenader
3 min read
javascript

JavaScript 中的 this 用法以及 call(apply) 的理解

想要深入了解 JavaScript 这门语言,一个必须掌握的知识点就是对 `this` 的理解。其中, `call` 和 `apply` 又与 `this` 有着密切的联系。趁现在有空,在网上看了一些教程之后,自己根据印象将其整理在这篇博文中。 this 是什么 this 是 JavaScript 中的一个关键字。它用在对象的方法中。 this 总是指向调用该方法的对象。举个最简单的例子: 当 this 在对象的方法中 var obj = { name : 'object',

  • serenader
    serenader
6 min read
javascript

(function(window, undefined){})(window)这种写法的原理

在看一些 jQuery 插件的时候经常会看到这样的写法: (function(window, undefined){ ... //code goes here })(window) 或者这样的: (function($, window, undefined){ ... //code goes here })(jQuery, window) 其实上面两个例子从根本上讲是一样的。 为何要在匿名函数中传入 $ 和 window 和undefined 形参呢? 先来说说前两个形参。 JavaScript 的解析器解析代码其实是从里到外解析的,也就是说,解析器会先解析函数内部的代码,然后再解析函数外部的代码。这样的话,如果我们在函数内部引用了

  • serenader
    serenader
5 min read
javascript

<script> 标签应该放在 HTML 页面中的哪里?

首先说说浏览器在下载 JS 文件时情况是怎样的。 在低版本浏览器中,当页面载入时,浏览器解析到 JavaScript 标签时,如果是外链 JS 文件的话,则会开始下载 JS 文件,并且会阻塞其他文件的下载,比如排在这个 JS 文件后面的 JS 文件或者图片等。 在 IE 8, Firefox 3.5, Safari 4, Chrome 2 等高版本浏览器中是允许并行下载 JS 文件的。

  • serenader
    serenader
2 min read
object

在 JavaScript 中创建Object

JavaScript 是一门强类型的面向对象语言,实质是 Prototype-based Language ,语言本身没有 类 的概念。在 JavaScript 一切都是以对象的形式存在,包括 Function , Array , Object , String 等。接下来谈谈如何创建 Object 。 创建对象 1. 工厂模式 工厂模式是以一个函数封装一系列属性和方法的形式创建对象。下面是例子: function createPerson(name,age,job){ var o = new Object(

  • serenader
    serenader
14 min read

Subscribe to Serenader