longwanxiang的博客 | Ryuurock

再谈 web 加载性能优化——字体裁剪

为什么要说再谈呢，顶着强烈“羞耻感”翻了翻以前写的文章，发现居然有前端疑难问题整理-优化篇。里面好多手段这么多年过去了，依旧非常实用，甚至有些直接手段都被框架内置了。如：nextjs提供的 Image 组件拥有开箱即用的优化手段：默认的懒加载（即图片在视口外不加载图片）内置的图片高保真压缩能力响应式图片尺寸根据 ua 返回不同格式的图片（如 webp）最近接到了做公司官网 S......

Posted by Wanxiang Long(Ryuurock) on 2021-12-27

scratch 应用体积优化之——微前端化 scratch extensions

前言微前端的实现好像也用不到什么突然出现的新技术，或者有什么高深莫测的概念，可近两年它就火了。早在 2016 年被 Thought Works 提出后，也好像没有掀起什么波澜，直到 19 年 20 年，qiankun 等一众微前端的框架出现后这个词才渐渐热起来。在这个概念提出前，也有 iframe 这样的解决方案达到了类似的效果，只是它不够标准化，也没有一个高大上的名字，我们只管叫它应用......

Posted by Wanxiang Long(Ryuurock) on 2021-12-01

scratch 微前端

Scratch 漫谈

先引用一段来自基维百科对scratch的解释 Scratch是麻省理工媒体实验室终身幼稚园组开发的一套电脑程序开发平台，目前在在150多个国家/地区使用，并提供60多种语言版本。由Mitchel Resnick和Andrés Monroy-Hernández创立。它大概长这样⬇️ 它一度进入编程语言排行榜第20名。对于用户来说：它功能强大，上手简单。使用自然语言+一点点逻辑就能让......

Posted by Wanxiang Long(Ryuurock) on 2021-03-14

scratch

blockly初探

图形化编程必备——blockly

Blockly由google开发，scratch基于blockly创建了scratch-blocks，blockly地址https://developers.google.com/blockly/，github源码地址https://github.com/google/blockly Blockly工作区域名词介绍：技术介绍： blockly90%的视觉技术以svg为主，包括代码块、滚动......

Posted by Wanxiang Long(Ryuurock) on 2019-11-15

React高阶组件之反向继承

高阶组件（HOC）相信大伙儿都不陌生，但是很少有看到介绍反向继承的。先介绍背景：博主有一部分的工作时间是在开发内部使用的管理系统的，渐渐发现，90%的页面具有类似的UI，像这样配合自研的框架+ant design，其实实现起来已经非常的容易了，编辑好searchFields，columnsFields，然后组织数据就能渲染出搜索表单和数据列表项。有的然后大部分页面有操作，审核、编辑等......

Posted by Wanxiang Long(Ryuurock) on 2019-02-20

react

一篇前端面试题的作业

原文地址：2019年前端面试都聊啥？一起来看看有一些问题自己的答案不是很清楚，所以直接实践后贴出来基本的JavaScript问题使以下代码正常运行：参考答案： 123456Array.prototype.multiply = function() { this.push(...this.map(item => Math.pow(item, 2)));} ......

Posted by Wanxiang Long(Ryuurock) on 2018-11-25

面试

不一样的Web Components——Shadow DOM

在Reactjs、Vuejs和Angular大行其道的今天，大家所熟知的web组件更多的是由框架本身定义的一套组件规范，如Reactjs的组件是一个js或者jsx文件，里面可以直接写类似于html标签的代码。Vuejs推崇的“关注点分离”自己创造了一种文件格式.vue作为组件，里面可以直接写web的“三剑客”：html、js和css。而angular（2.x以上）则不同于前面两者，官方示例则......

Posted by Wanxiang Long(Ryuurock) on 2018-10-21

记一次博客从http到https的迁移（nginx的使用）

最近心血来潮，想把一件一直没干的事情干了——把博客迁移到国外的vps。至于为什么迁，一是国内的vps租不起，二是在国内假网站那漫长的备案时间就够感人了，三是放到github.io上面百度的spider爬不到，影响我优秀的博客的曝光率（#手动滑稽）。多方查证后，原来是因为百度的爬取频率太高，给服务器造成压力，所以github不喜欢这样的spider，所以直接403了。反正最近什么都到期了，去......

Posted by Wanxiang Long(Ryuurock) on 2018-06-09

nginx

canvas粒子效果初探

我是谁我在哪儿

在这之前对canvas这个标签还一直停留在效果炫酷 api复杂难懂好吧，直到今天我也是这么觉得，但是好在已经有很多详细的文档和例子来帮我们理解这些api。今天我们要做的canvas粒子效果如下图所示踩坑： canvas这个标签，设置宽高的时候是要使用标签的width和height属性来设置的，不能通过style的宽高来设置，否则会造成绘制出来的图形很模糊并且位置产生偏移废话不......

Posted by Wanxiang Long(Ryuurock) on 2018-05-18

canvas

新工作，新生活

我没想到会把这种口水话记录在博客里，也算是对职业生涯的记录吧

我没想到会把这种口水话记录在博客里，也算是对职业生涯的记录吧。 “微知”是我第一个参与孵化的项目。回想这两年多一路走来，每个加班的夜晚都历历在目。朋友说我“真能呆”，一呆就是在一个小公司呆了两年。我想大概是因为爱？微知从无到有，再到试图推广、试图融资、试图转型，都记录在了这五六十次上线发布里了。从祖传的多页到引入requireJs模块化开发，再到过渡到webpack，都是我一手慢慢调教过......

Posted by Wanxiang Long(Ryuurock) on 2018-03-16

job

Longwx Blog