Skip to content

Instantly share code, notes, and snippets.

View MuYunyun's full-sized avatar
🐢
Working and Learning

MuYunyun

🐢
Working and Learning
  • Shanghai, China
View GitHub Profile
@MadhuNimmo
MadhuNimmo / rangeerror.js
Created October 14, 2022 19:53
Simplest solution to JSON.stringify RangeError: Invalid string length
var out="[";
for(var indx=0;indx<data.length-1;indx++){
out+=JSON.stringify(data[indx],null,4)+",";
}
out+=JSON.stringify(data[data.length-1],null,4)+"]";
const musicNotify = () => {
const m = '/storage/emulated/0/Download/WeiXin/平凡之路.mp3'
media.playMusic(m);
sleep(media.getMusicDuration());
}
const to_mall_cart = () => {
shopping_cart_btn=id('img_shopping_cart').findOne()
const bypass = [
// function names to avoid logging
];
const collapsed = [
// function names to groupCollapsed
];
module.exports = function(babel) {
const { types: t } = babel;
const wrapFunctionBody = babel.template(`{
@snakeUni
snakeUni / hooksAndClass.md
Last active May 26, 2019 04:19
hooks vs class

Hooks vs Class

React 释放 hooks 已经半年了,从 hooks 刚刚释放的时候我就开始关注,并且就开始去尝试使用它。 从释放到现在 hooks 刚过不少, 内部源码至少改了两三次, 那为什么要写这篇文章呢 ? 是因为一次偶然的事情引发的。 有一天渊虹老哥抱着电脑对我说, 你看我这个表单的提交时间就是在调用 onSubmit 的时候有点延迟啊, 这是为什么呀? 我试了一下果然是这样, 很奇怪了,为什么会这样呢 ? 于是我想到的第一个问题就是难道我把同步当做异步处理导致的? 还是有可能的啊,于是我在群里问了这样的一个问题 0fc339b7 756155c1 于是我就在第二天跑了一下,试试同步当做异步处理的话,会造成多少的延迟。当数量小于100个时候,简单的函数同步异步时间基本一致,1000个的时候时间就有一些小的差距了, 10000 个的时候差距非常明显, 所以必要的时候,同步还是同步,不要当做异步来处理了, 那一个 form 内部超过 100 个校验函数基本不可能,所以这个方面我就忽略了, 那会不会是另外一种可能呢?

render 时间长且次数多导致的延迟

再一次分析了渊虹老哥的代码,发现在提交表单的时候,render 了四次,于是我去查了下源码,发现这四次分别是,校验设置错误 => 设置提交状态 => 设置表单是否有效 => 设置提交次数, 然后在调用 onSubmit, 哎呀这个地方有有待修改的,比如可以改成这样 设置提交状态 => 如果有效,调用 onSubmit 在设置有效状态和提交次数。 否则在 设置错误和状态, 这样呢就能保证 onSubmit 的提交只有一次 setState 的操作,看下代码的截图

@gaearon
gaearon / uselayouteffect-ssr.md
Last active May 16, 2024 14:13
useLayoutEffect and server rendering

If you use server rendering, keep in mind that neither useLayoutEffect nor useEffect can run until the JavaScript is downloaded.

You might see a warning if you try to useLayoutEffect on the server. Here's two common ways to fix it.

Option 1: Convert to useEffect

If this effect isn't important for first render (i.e. if the UI still looks valid before it runs), then useEffect instead.

function MyComponent() {
@quisido
quisido / suspense-promise.js
Last active May 27, 2023 12:24
React Suspense with the Fetch API
class Suspense extends React.Component {
constructor(props) {
super(props);
this.state = {
promise: null
};
}
componentDidCatch(e) {
@bvaughn
bvaughn / index.md
Last active April 3, 2024 07:41
Interaction tracing with React

This API was removed in React 17


Interaction tracing with React

React recently introduced an experimental profiler API. After discussing this API with several teams at Facebook, one common piece of feedback was that the performance information would be more useful if it could be associated with the events that caused the application to render (e.g. button click, XHR response). Tracing these events (or "interactions") would enable more powerful tooling to be built around the timing information, capable of answering questions like "What caused this really slow commit?" or "How long does it typically take for this interaction to update the DOM?".

With version 16.4.3, React added experimental support for this tracing by way of a new NPM package, scheduler. However the public API for this package is not yet finalized and will likely change with upcoming minor releases, so it should be used with caution.

@mattmccarty
mattmccarty / git-log-beautifier
Created March 20, 2017 21:20
Beautify the output of git-log
# Issue the command below:
git config --global alias.lg "log --color --graph --pretty=format:'%Cred%h%Creset -%C(yellow)%d%Creset %s %Cgreen(%cr) %C(bold blue)<%an>%Creset' --abbrev-commit"
# When you want to beautify the git log, use the following command:
git lg
# Reference:
https://coderwall.com/p/euwpig/a-better-git-log
@Saul-Mirone
Saul-Mirone / mini-express.js
Last active November 15, 2019 12:36
Just An Express Style Framework
const http = require('http')
const url = require('url')
const path = require('path')
const fs = require('fs')
const mime = {
"html": "text/html",
"css": "text/css",
"js": "text/javascript",
"json": "application/json",
"gif": "image/gif",
@steipete
steipete / ios-xcode-device-support.sh
Last active December 12, 2023 03:36
Using iOS 15 devices with Xcode 12.5 (instead of Xcode 13)
# The trick is to link the DeviceSupport folder from the beta to the stable version.
# sudo needed if you run the Mac App Store version. Always download the dmg instead... you'll thank me later :)
# Support iOS 15 devices (Xcode 13.0) with Xcode 12.5:
sudo ln -s /Applications/Xcode-beta.app/Contents/Developer/Platforms/iPhoneOS.platform/DeviceSupport/15.0 /Applications/Xcode.app/Contents/Developer/Platforms/iPhoneOS.platform/DeviceSupport
# Then restart Xcode and reconnect your devices. You will need to do that for every beta of future iOS versions
# (A similar approach works for older versions too, just change the version number after DeviceSupport)