我是一个软件开发工程师

乐观 积极 生活如此精彩

总有快乐的事情降临

这是一个精彩的世界,不是吗?

技术精要

这里是我的一些你可能需要的技术摘要

动画与效果

一些常见的动画和效果

算法与逻辑

常用的算法和逻辑推导

性能与技巧

关于性能和技巧方面的总结

几个有趣的数学问题

问题:找出所有使得 2n – 1 能被 7 整除的正整数 n 。

答案:由于 2n 的二进制表达为 1000…00 (n 个 0),因此 2n – 1 的二进制表达为 111…11 (n 个 1)。而 7 的二进制表达是 111 ,要想让它整除 n 个 1 ,显然 n 必须是也只能是 3 的倍数。

问题:是否存在 100 个数,使得它们的和等于它们的最小公倍数?

答案:存在。考虑 3, 2 × 3, 2 × 32 , 2 × 33, …, 2 × 398, 399 ,它们的和为:

   3 + 2 × 3 + 2 × 32 + 2 × 33 + … + 2 × 398 + 399[......]

继续阅读

观察者模式

观察者模式

目前有很多流行的技术用到了这个思想,比如Redux、mobx等,这里将多年前的ECMAScript代码改写成现代的ECMAScript代码。这里只做简单演示,请勿直接用于生产。

首先是派发者,派发者需要添加侦听、移出侦听和派发事件:

class Sender {

    private receiver: any[] = [];//接收者对象列表

    private eventMsg!: string;//发送的事件信息

    public constructor() {
    }

    public addEventListener(o: Receiver): vo[......]

继续阅读

REACT & ANT Design

Ant Design是一个React UI库,它包含大量已经封装好的常用组件,用于构建现代优雅的用户界面。

ant Design由阿里巴巴前端组创建,已经被很多知名企业使用:腾讯,百度等。

还有一个mobile版的Ant Design,点击mobile Ant Design查阅。

安装

这里我将使用create-react-app演示todolist示例。

安装antd依赖:

$ npm install antd --save
    or
$ yarn add antd

在根组件中导入:

import React from "react";
import React[......]

继续阅读

REACT组件懒加载

元旦了。😁

react 16.6开始加入了代码拆分和懒加载功能,减轻了很多开发者的工作。

安装

$ npm install --save react react-dom
    or
$ yarn add react react-dom

在要处理延迟加载的组件中导入Suspense并lazy:

import React, { lazy, Suspense } from 'react';

代码拆分

虽然Suspense并且lazy允许快速创建延迟加载组件,但如果将整个应用程序打包到Webpack这样的单个文件中并没有什么好处。

Webpack不在本文的[……]

继续阅读

视觉设计-滚动效果

通常开发者会使用JavaScript来实现许多常见的效果,但是很多效果CSS就可以实现。下面就是比较常见的视觉效果案例。(背景图像的滚动速度比页面内容慢,产生视觉错位的幻觉。)

虽然在JavaScript中实现这种效果的案例很少,我只演示CSS的实现方式(注意浏览器兼容性)。

HTML

不需要太多html标签:

<main class="wrapper">
  <section class="section parallax bg1">
    <h1>nhehehe...</h1>
  </section>
  &l[......]

继续阅读

图形演算–寻路算法

前言

寻路算法大致可以分为「深度优先搜索(Depth-First Search,DFS)、广度优先搜索(Breath-First Search,BFS)和最佳优先搜索(Best-First Search,BestFS)三大类。

对于最佳优先搜索部份,较为熟悉的是A*寻路算法。

图形描述

图形是由节点(node)与线(edge)组成的。比如,下面包含六个节点与十条线组成的简单图形:

A Star

深度优先搜索

深度优先搜索(DFS),就是一直搜索距当前节点最近的没有被访问过的最近临节点的一种方法

这种方法可以采用「递归搜索」完成:

dfs(g, node) {
  if (g[no[......]

继续阅读

前端机器人开发基础

web embedded

随着技术的发展,越来越多的企业开始招聘前端硬件,其开发效率和性能没有任何一种技术可以媲美,前景越来越好。这里给开发人员一个机器人开发示例,由于机器人开发后期需要大量算法支持,这里只做硬件层的讲解。

硬件要求和基础配置详讯相关专业人士,这里将所有需要文件下载到本地,并使用npm作为开发配置工具。

创建项目及相关文件

首先使用创建项目并用npm初始化:

mkdir && cd robot-demo
npm init -y

这里在初始化时使用了npm默认的配置,根据需求修改,也可以创建完成后修改:

app name: robot-demo
version: 0.1.[......]

继续阅读

web性能优化基础

网页性能对网站至关重要,每一个细节都要处理好。一个完整的请求需要经过 DNS寻址、与服务器建立连接、发送数据、等待服务器响应、接收数据这样一个 “漫长” 而复杂的过程。

资源压缩与合并

对于css加载的图片可以采用纹理贴图。

针对代码体积及文件加载,可以利用webpack 模块化打包工具分块打包、按需加载以及提取公共部分代码,利用缓存可以得到解决。

DNS预解析

从用户输入一个网址到网页最终展现到用户面前,中间的大致发生以下几个流程:

  1. 发送到DNS(域名服务器)获得域名对应的WEB服务器的IP地址。
  2. 客户端浏览器与WEB服务器建立TCP(传输控制协议)连接。
  3. 客户端浏览器向对应[……]

    继续阅读

区块链量子理论基础

随着中国科学技术大学潘建伟实验室实现了18bit得量子纠缠,量子技术的应用也会越来越广泛。这里只讲量子应用在区块链中的应用。

由于量子技术非常复杂,需要大量数学、物理等各方面的基础,我会尽量得简化以方便阐述,具体请找相关专业人士。

双缝实验

1807年,托马斯·杨第一次描述了双缝实验:把一支蜡烛放在一张开了一个小孔的纸前面,形成一个点光源。在纸后面再放一张开了两道平行狭缝的纸。从小孔中射出的光穿过两道狭缝投到屏幕上,就会形成一系列明、暗交替的条纹。

blockchain quantum physics

试验本身没什么问题,证明了光有波粒二象性,但是科学家们想观察清楚具体是怎么形成这种条纹的,于是科学家们架设了高速摄像机,观察这些光子是[……]

继续阅读

区块链基础

这里讨论区块链的基本原理和实现,更多技术可与我联系🏸

技术等级
高级

Server

首先是服务搭建,建议使用ES草案(即将发布为推荐标准),将高级ES编译为二进制低级ES,性能和C/C++一样,就不用担心各种性能问题了。

为了简化步骤,我使用Express,所有代码均为演示,不建议实际项目使用。

启动服务

/*
 * @Author: indeex
 * @Date: 2018-06-24 15:21:53
 * @LastEditors: indeex
 * @LastEditTime: 2018-06-25 15:50:39
 * @Description:[......]

继续阅读