tbswang's blogs

发表于

不使用USB向kindle发送书

神奇的原理：kindle内置了一个浏览器，可以浏览和下载文件，利用这个，可向kindle发送文件，比如电子书。

步骤

Step1 启动一个http server

需要先安装node

1
2
3
npm i -g http-server
cd <path to you file directory>
http-server

启动完之后，会显示内网ip

1
2
3
4
5
Available on:
  http://127.0.0.1:8080
  http://192.168.31.204:8080 // 重要
Hit CTRL-C to stop the server

Step2 在kindle中访问

访问上面显示的地址，根据自己网络环境会不同，以我的为例，是http://192.168.31.204:8080

Step3 点击文件名，下载即可。

「done」

发表于

原文： https://github.com/mithi/react-philosophies

0.介绍

react哲学是：

  • 我在编写React代码时会考虑的事情。
  • 每当我查看别人或我自己的代码时，我都会想到
  • 只是指导方针，而不是严格的规则
  • 一个动态的文件，随着我的经验增长和时间变化而变化
  • 大多数技术是基本重构方法、SOLID原则和极端编程思想的变体……只是专门应用于React🙂

react-哲学 的灵感来自我在编码之旅的不同阶段， 在不同地方的偶然发现。

这里有几个：

作为一名经验丰富的开发人员，我有一些我所依赖的怪癖、观点和常见模式。不得不向另一个人解释为什么我会以特定的方式解决问题，这对于帮助我改掉坏习惯和挑战我的假设，或为良好的问题解决技巧提供验证真的很有好处。-卡洛琳阿达Ehmke

阅读全文 »

发表于

WebGL(Web Graphics Library)是在浏览器中渲染3D图形，并可与之交互的技术。

  • WebGL实现
  • svg vs canvas vs WebGL
  • 一个简单的例子: 点
  • 再来一个例子: 彩色三角形
  • 一个复杂的例子: 立方体
  • 为何放弃
  • 相关的类库和参考资料
阅读全文 »

发表于

简介

搜了一下中文互联网好像没有介绍mapbox-gl的源码， 所以打算记录下mapbox-gl的源码学习的经验。本文代码基于1.3版本。笔者也不是专业的地图开发，本系列文章从前端、可视化、代码架构分析。

阅读全文 »

发表于

原文: https://www.usenix.org/system/files/atc19-jangda.pdf

摘要

现在，所有主要的Web浏览器都支持WebAssembly，这是一种低级字节码，可以由C和C++代码的编译生成。WebAssembly的一个关键目标是与本机原生代码实现性能均等。之前的工作报告显示他们是几乎是等价的，许多编译到WebAssembly的应用程序的运行速度比原始代码平均慢10％。但是，这些评估仅限于一组科学内核，每个内核包含大约100行代码。无法运行大型的应用程序，将代码编译为WebAssembly是难题的一部分,另外标准的Unix API在Web浏览器环境中不可用。为了应对这一挑战，我们构建了BROWSIX-WASM，这是对[BROWSIX][29]的重要扩展，这是第一次, 使在浏览器内直接运行的WebAssembly编译的Unix应用程序。 然后，我们使用BROWSIX-WASM对WebAssemblyvs的性能进行首次大规模评估。在SPEC CPU基准测试套件中，我们发现了巨大的性能差距：编译为WebAssembly的应用程序的运行速度平均降低了45％（Firefox）至55％（Chrome），峰值速度降低了2.08×（Firefox）和2.5×（Chrome ）。我们确定了造成这种性能下降的原因，其中一些是由于缺少优化和代码生成问题而引起的，而另一些是由于WebAssembly所固有的。

阅读全文 »

发表于

ABSTRACT

本文主要介绍webpack基本的打包原理.

打包主要三个步骤:

  1. 转换代码
  2. 生成依赖图
  3. 生成代码字符串

然后通过require函数将代码组织到bundle(代码块)中,就齐活了

参考资料

  1. https://juejin.im/post/6844903858179670030 : 提供的主要思路
  2. https://github.com/airuikun/blog/issues/4 : 这个讲的比第一个详细
  3. https://zhuanlan.zhihu.com/p/107125345 : 这个排版和代码看着更舒服. 可以合1,2结合看
  4. https://aotu.io/notes/2020/07/17/webpack-analize/index.html 这个实践不错

发表于

摘要

INTRODUCTION

cra(create-react-app)是react官方出品的初始化react的工具.他本质是一个封装了一个webpack.而webpack是依赖node运行的.所以对cra调试, 就是对nodejs调试.

配置

首先选择debugg, 生成一个新的launch.json文件.

cra官方

链接: https://create-react-app.dev/docs/debugging-tests/

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
{
  "version": "0.2.0",
  "configurations": [
    {
      "name": "Debug CRA Tests",
      "type": "node",
      "request": "launch",
      "runtimeExecutable": "${workspaceRoot}/node_modules/.bin/react-scripts",
      "args": ["test", "--runInBand", "--no-cache", "--watchAll=false"],
      "cwd": "${workspaceRoot}",
      "protocol": "inspector",
      "console": "integratedTerminal",
      "internalConsoleOptions": "neverOpen",
      "env": { "CI": "true" },
      "disableOptimisticBPs": true
    }
  ]
}

create-react-app-rewired

1
2
3
4
5
6
7
{
  "type": "node",
  "request": "launch",
  "name": "Launch Program",
  "runtimeExecutable": "${workspaceFolder}/node_modules/react-app-rewired/bin/index.js",
  "args": ["start"],
},

通过npm命令

TODO:暂未成功

1
2
3
4
5
6
7
8
{
  "name": "Launch via npm",
  "type": "node",
  "request": "launch",
  "cwd": "${workspaceFolder}",
  "runtimeExecutable": "npm",
  "runtimeArgs": ["run-script", "start"],
},

使用

以react-app-rewired为例, 在override-config.js中打断点就可以.

发表于

原文: https://www.ibm.com/blogs/research/2020/06/ibm-releases-fully-homomorphic-encryption-toolkit-for-macos-and-ios-linux-and-android-coming-soon/

通常,当我和别人解释全同态加密的时候,我就说,虽然我已经在这个领域工作了将近十年, 但我也必须停下来拼出来.所以,让我们就简单的把它叫做FHE.

半开玩笑的讲,当你第一次听到FHE,它听起来就像是魔法, 但是他是基于非常安全的数学.主要的区别是,FHE需要对我们常用的编程范式做一些转换,这让她在转换为应用的时候有点困难.直到今天,多亏了我们在macos,ios和接下来的linux和安卓的新工具包,才让他变得可用.事实上,对基本的平台工具熟悉的开发者, 根据一些简单的介绍,就可以快速的上手.将11年的顶级加密研究,在泡一杯咖啡或者整理桌子的时间内,转换为免费的,开发者可用的,是一个不小的壮举.

阅读全文 »
0%