mynane / web-problem Goto Github PK
View Code? Open in Web Editor NEW收集平时遇到的问题
收集平时遇到的问题
什么是PWA ?
PWA 解决什么问题?
PWA 给我们带来了什么变化?
PWA 关键技术?
PWA 还存在什么不足?
总结
网络资源标注出处
Vue 和 React 是两个不同的前端框架,它们在处理组件更新和渲染的方式有所不同,因此并不都需要类似于 React Fiber 的机制。
以下是一些原因解释为什么 Vue 没有采用类似于 React Fiber 的调度机制:
不同的渲染方式: Vue 使用的是基于依赖追踪的渲染机制,称为"响应式系统"。Vue通过追踪组件内部的数据依赖关系,当数据发生变化时,只重新渲染受影响的组件,而不需要像 React Fiber 那样将渲染过程分割成多个任务单元。
性能优化: Vue 的响应式系统和虚拟 DOM 组合在一起,可以在更新时进行一定程度的性能优化。Vue通过比对虚拟 DOM 树的变化来最小化实际的 DOM 操作,这种方式在许多情况下能够提供足够的性能。
异步更新控制: Vue 提供了异步更新控制机制,允许您明确控制何时触发组件更新。这种方式可以避免不必要的渲染和优化性能。
单线程执行: Vue 使用单线程的方式执行渲染和更新操作,这使得它更容易理解和调试。React Fiber 引入了多任务和任务优先级的概念,使得框架的复杂性增加。
尽管 Vue 和 React 采用了不同的渲染和更新机制,但它们都致力于提供高性能和响应性的用户界面。每个框架都有其独特的设计理念和适用场景,选择使用哪个框架通常取决于项目需求和开发团队的偏好。因此,并不是每个框架都需要类似于 React Fiber 的调度机制,而是根据框架的设计和目标来选择适当的优化方法。
网络资源注明来源
网上查找资源收录需要备注出处
网络资源注明出处
/* @flow */
/* globals MessageChannel */
import { noop } from 'shared/util'
import { handleError } from './error'
import { isIOS, isNative } from './env'
const callbacks = []
let pending = false
function flushCallbacks () {
pending = false
const copies = callbacks.slice(0)
callbacks.length = 0
for (let i = 0; i < copies.length; i++) {
copies[i]()
}
}
// Here we have async deferring wrappers using both microtasks and (macro) tasks.
// In < 2.4 we used microtasks everywhere, but there are some scenarios where
// microtasks have too high a priority and fire in between supposedly
// sequential events (e.g. #4521, #6690) or even between bubbling of the same
// event (#6566). However, using (macro) tasks everywhere also has subtle problems
// when state is changed right before repaint (e.g. #6813, out-in transitions).
// Here we use microtask by default, but expose a way to force (macro) task when
// needed (e.g. in event handlers attached by v-on).
let microTimerFunc
let macroTimerFunc
let useMacroTask = false
// Determine (macro) task defer implementation.
// Technically setImmediate should be the ideal choice, but it's only available
// in IE. The only polyfill that consistently queues the callback after all DOM
// events triggered in the same loop is by using MessageChannel.
/* istanbul ignore if */
if (typeof setImmediate !== 'undefined' && isNative(setImmediate)) {
macroTimerFunc = () => {
setImmediate(flushCallbacks)
}
} else if (typeof MessageChannel !== 'undefined' && (
isNative(MessageChannel) ||
// PhantomJS
MessageChannel.toString() === '[object MessageChannelConstructor]'
)) {
const channel = new MessageChannel()
const port = channel.port2
channel.port1.onmessage = flushCallbacks
macroTimerFunc = () => {
port.postMessage(1)
}
} else {
/* istanbul ignore next */
macroTimerFunc = () => {
setTimeout(flushCallbacks, 0)
}
}
// Determine microtask defer implementation.
/* istanbul ignore next, $flow-disable-line */
if (typeof Promise !== 'undefined' && isNative(Promise)) {
const p = Promise.resolve()
microTimerFunc = () => {
p.then(flushCallbacks)
// in problematic UIWebViews, Promise.then doesn't completely break, but
// it can get stuck in a weird state where callbacks are pushed into the
// microtask queue but the queue isn't being flushed, until the browser
// needs to do some other work, e.g. handle a timer. Therefore we can
// "force" the microtask queue to be flushed by adding an empty timer.
if (isIOS) setTimeout(noop)
}
} else {
// fallback to macro
microTimerFunc = macroTimerFunc
}
/**
* Wrap a function so that if any code inside triggers state change,
* the changes are queued using a (macro) task instead of a microtask.
*/
export function withMacroTask (fn: Function): Function {
return fn._withTask || (fn._withTask = function () {
useMacroTask = true
const res = fn.apply(null, arguments)
useMacroTask = false
return res
})
}
export function nextTick (cb?: Function, ctx?: Object) {
let _resolve
callbacks.push(() => {
if (cb) {
try {
cb.call(ctx)
} catch (e) {
handleError(e, ctx, 'nextTick')
}
} else if (_resolve) {
_resolve(ctx)
}
})
if (!pending) {
pending = true
if (useMacroTask) {
macroTimerFunc()
} else {
microTimerFunc()
}
}
// $flow-disable-line
if (!cb && typeof Promise !== 'undefined') {
return new Promise(resolve => {
_resolve = resolve
})
}
}
收录一些网上看到的资料
网络资源备注来源
网络资源注明出处
网络资源注明出处
网络资源注明出处
网络资源注明出处
网上资源请注明出处
WebAssembly是什么?
WebAssembly解决什么问题?
应用在那些方面?
还存在什么问题?
给前端带来了什么?
浏览器支持情况?
总结
网络资源注明出处
参考资料:
网上资料需标注出处
网上资源注明出处
数据结构:列表、栈、队列、链表、字典、散列、图和二叉查找树
排序算法:冒牌排序、选择排序、插入排序、希尔排序、归并排序和快速排序
查找算法:顺序查找和二分查找
网络资源标注出处
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.