This article provides a comprehensive analysis of Vue.js slot mechanisms, covering normal slots, scoped slots, and the v-slot syntax, with detailed code examples and explanations of the underlying rendering functions and compilation processes.
This article introduces the Flash-Waimai project—a full‑stack food delivery system built with Spring Boot, Vue.js, MySQL and MongoDB—detailing its architecture, module breakdown, database setup, quick‑start commands, and step‑by‑step instructions for launching the backend, admin portal, and mobile client.
This talk explains how Vue.js can be leveraged to create high‑performance Flutter applications by bridging front‑end ecosystems with W3C‑based rendering, addressing the challenges of Dart‑centric development and showcasing the Kraken engine's role in achieving consistent multi‑device experiences.
This article explains how the growing need for cross‑platform development, especially with IoT devices, makes Flutter popular yet costly, and introduces a W3C‑standard‑based solution that uses Vue.js and the Kraken engine to connect front‑end ecosystems with consistent multi‑device rendering.
This article presents a comprehensive overview of JSX support in Vue 3, covering its origins, differences from template syntax, migration details, practical usage scenarios, handling of props and slots, performance considerations, and the underlying compilation mechanisms such as PatchFlags and SlotFlags.
This article outlines the design, deployment architecture, technology stack, and core features of a lightweight, open‑source file storage system built with modern front‑end and micro‑service back‑end technologies, offering file management, sharing, and distributed storage capabilities.
Vue.nextTick schedules callbacks using a graceful‑degradation chain (Promise, MutationObserver, setImmediate, setTimeout) that leverages the JavaScript event‑loop’s micro‑task queue, ensuring DOM mutations are applied instantly but rendered after microtasks and before macrotasks, while the browser’s multi‑threaded architecture coordinates rendering, timers, and network work.
This article provides a complete tutorial for building a food‑delivery system with a mobile app, backend management, and API, detailing the technology stack, module structure, database setup, code snippets, and step‑by‑step instructions to launch both the admin and mobile front‑ends.
This article presents a complete food‑delivery system with mobile, admin, and API modules, detailing its Spring Boot and Vue.js technology stack, module structure, database setup, quick‑start commands, and how to run both the management console and mobile client for learning purposes.
This article explains how the Laravel PHP framework and the Vue.js progressive JavaScript library complement each other, highlighting their popularity, ease of integration, event‑driven architecture, virtual DOM performance, and faster learning curve, making them an ideal stack for new web projects.
This article deeply analyzes Vue.js's mergeOptions function, explaining how merge strategies are defined and applied to options like data, props, hooks, assets, and watchers, with detailed code examples and step‑by‑step breakdowns to help developers understand Vue's option merging mechanics.
This article explains how Vue’s mergeOptions function merges constructor and instance options, detailing the normalization of props, inject, and directives, and how extends and mixins are recursively combined to produce the final component configuration.
Vue’s keep-alive component enables dynamic tab caching in B‑end applications by storing component VNodes in an internal LRU cache, preserving state across route switches, supporting include/exclude patterns, router‑meta flags, Vuex‑driven lists, and custom strategies for nested routes to prevent stale data and excess API calls.
This article explains how Vue.js parses and merges constructor options during instance creation, covering the initMixin flow, the resolveConstructorOptions function for both base Vue constructors and Vue.extend subclasses, and the underlying source files that define core components, directives, filters, and the _base reference.
Flash‑Waimai is an open‑source, full‑stack food delivery application featuring a mobile client, admin portal, and API, built with Spring Boot for the backend, Vue.js for the frontend, MySQL and MongoDB for data storage, and includes detailed setup instructions, code snippets, and deployment guides.
This article explains what Vue.js mixins are, how they merge component options, demonstrates their behavior with code examples, and shows practical use cases such as shared download logic to reduce redundancy across multiple components.
This article explains the purpose of the key attribute in Vue, demonstrates why using the array index or random numbers as keys breaks the virtual‑DOM diff algorithm, and provides best‑practice recommendations for stable, unique keys to ensure efficient component updates.
This article walks through Vue 2.0's core source code, explaining the initialization and mounting process, the three‑stage template compilation (parse, optimize, generate), the reactivity system with dependency collection, and how the virtual DOM and patch algorithm update the view.
After replacing its three‑year‑old Arm.js stack with a Vue.js + Node.js architecture, iQIYI’s smart‑cloud video platform tackled loading, rendering, and API bottlenecks by using CDN‑served library DLLs, refined Webpack splitChunks, lazy‑loaded components with skeleton screens, and rewrote the BFF in NestJS, cutting bundle size by two‑thirds, reducing first‑page load to 790 ms and halving core API latency.
This article explains how to adapt Vue.js web pages for diverse mobile devices by configuring the viewport meta tag, using relative and viewport units, applying flex layouts, handling fixed positioning issues, implementing route transitions, and leveraging useful plugins and component registration methods.
This article introduces a lightweight, open‑source netdisk system built with a front‑end Vue.js interface and a back‑end micro‑service architecture using SpringBoot, Dubbo, Zookeeper, Redis, Solr, and FastDFS, detailing its deployment, technology stack, and core features for file management and integration.
The Tencent IMWeb team’s 2020 analysis highlights seven key frontend trends—explosive TypeScript adoption, React’s dominance among major frameworks, the rise of WebAssembly, accelerating low‑code platforms, serverless full‑stack development, DevOps maturation, and booming WebRTC—while forecasting continued growth in these areas for 2021.
This article walks through Vue 3's initialization process, explaining what createApp(App).mount('#app') does, how the runtime‑dom and runtime‑core modules create and render VNodes, and how patch, shapeFlags, and patchFlags drive efficient DOM updates.
Vue.js lifecycle hooks guide developers through a component’s creation, mounting, updating, and destruction phases, providing automatic callbacks such as beforeCreate, created, beforeMount, mounted, beforeUpdate, updated, beforeDestroy, and destroyed, which enable proper data fetching, DOM manipulation, reactive updates, and resource cleanup at the appropriate moments.
The article chronicles Evan You’s unconventional path from art student and anime enthusiast to creator of the Vue framework, highlighting his motivations, the naming of Vue releases, community growth, funding model, and his advice for non‑CS developers in modern front‑end development.
The article reviews Vue 3's official release, explains the Teleport feature for rendering content outside component trees, introduces the lightweight vue‑lit library for building Web Components with Vue's reactivity, and highlights related graphics experiments, legacy version comparisons, and Taro integration for mini‑program development.
This tutorial walks you through downloading RuoYi-Vue 3.1, creating a MySQL database, importing required SQL files, configuring Redis and application settings, and then launching the Spring Boot back‑end and Vue front‑end so you can access the admin console at http://localhost:81/.
Vivo Mall transformed its Java‑centric frontend into a layered Vue‑Node architecture, separating frontend and backend, unifying multiple platforms with BFF and SSR, building a shared UI library, adopting extreme modularization, and enforcing coding standards and quality tools to double development efficiency and improve scalability.
This guide explains how to add a ref to an Element UI el-form, use resetFields() to clear form inputs on reset or cancel actions, and then abstract the reset logic into a reusable global Vue method for use across multiple pages.
The article explains micro‑frontend concepts, why large apps are split into independent modules, critiques iframe drawbacks, details single‑spa’s resource loader and configuration approach with code examples, outlines its limitations, and shows how qiankun builds on single‑spa to automate resource discovery, sandboxing, and style isolation, concluding that micro‑frontends are a valuable strategy for large‑scale front‑end projects.
The article reviews Vue 3’s mid‑2020 status with three new SFC syntax‑sugar features, debates the future of front‑end/back‑end integration, evaluates popular data‑visualization frameworks, highlights security risks in Node.js’s legacy URL API, and showcases a DevOps‑based productivity tool and high‑performance mini‑program practices.
This article explains how Vue.js implements its reactivity system using the observer pattern, detailing the roles of Dep and Watcher classes, the observe function, Object.defineProperty handling for objects and arrays, and providing annotated code examples to illustrate the complete dependency‑collection workflow.
The Vue team explains why they are rebuilding Vue 3—leveraging new JavaScript features like Proxy, fixing architectural limitations, adopting TypeScript, improving performance and bundle size, and introducing a flexible Composition API—while using an RFC process to involve the community.
This article provides a detailed walkthrough of Vue.js’s internal vm._update method, its reliance on the core __patch__ function, and the surrounding lifecycle mechanisms, illustrating each step with source code excerpts and diagrams to clarify how virtual DOM nodes are transformed into real DOM elements.
This article chronicles Vue's journey from its first 0.6.0 release through major milestones like 1.0, 2.0, and the upcoming 3.0, explains the architectural changes, reactive system overhaul, Composition API, and provides practical code examples for migration and local experimentation.
Vivo’s Wukong Activity Middle Platform employs a micro‑frontend RSC architecture to streamline marketing H5 development by providing reusable components, template and task marketplaces, real‑time cloud configuration, asset libraries, and PaaS developer tools—including a VSCode plugin—reducing release cycles, resource waste, data silos, and security risks across 30+ business units.
This guide presents a high‑level knowledge map for Vue developers, covering essential JavaScript basics, core Vue concepts, component architecture, SPA routing, state management, real‑world tooling, testing, performance optimization, related ecosystems, and advanced frameworks like Nuxt and Vuetify.
This article provides a detailed walkthrough of Vue.js’s core initialization process, examining how the framework’s global API, asset registration, and various utility functions are set up through multiple layers of source code, with extensive code examples and explanations of each step.
This article explains how to scrape all of your Zhihu saved collections using a Python crawler, store the data in JSON files, and then serve it through a Flask backend API and a Vue.js single‑page front‑end, complete with screenshots and full source code.
Vue.js offers multiple component communication techniques—including one‑way props, $emit/$on events, an event bus, $attrs/$listeners, provide/inject, direct $parent/$children/$refs access, Vuex state management, and slot‑based patterns—enabling flexible data flow between parents, children, siblings, and distant descendants.
Vue 3 replaces Vue 2’s Object.defineProperty reactivity with a Proxy‑based system, using the Composition API (e.g., a reusable usePosition hook) to create reactive state, cache proxies via WeakMaps, differentiate array additions from length changes, and track dependencies through effect stacks for efficient updates.
This article provides a comprehensive tutorial on building a full‑stack application by setting up front‑end tools like Node.js and Vue.js, creating Vue projects with CLI, using Vue directives, routing and Axios for API calls, and integrating a Spring Boot backend with RESTful services, Dubbo RPC, and Spring Cloud components for microservice architecture.
This article details how the MPM page rendering service at JD.com was profiled with v8‑profiler, identified heavy replace and compile calls, and applied string‑splitting, Vue transformCode hooks, and a custom lightweight compiler to cut CPU consumption by roughly 20%, improving stability during traffic spikes.
Jennifer Bland explains how to halve a Vue.js production bundle from 2.48 MB to 1.28 MB by using webpack-bundle-analyzer and applying targeted optimizations such as removing unused libraries, importing only needed lodash functions, aliasing moment, and configuring vuetify-loader to include only required components.
This tutorial walks through creating a full‑stack video‑chat app that supports multiple chat rooms, private messaging, user status, and peer‑to‑peer video calls by combining Vue.js for the frontend, Vuex for state management, Socket.io for real‑time communication, a Node/Express backend, Redis for scaling, and Docker for deployment.
This article reviews various Vue.js component communication techniques—including Props, $emit/$on, Vuex, $attrs/$listeners, Provider/Inject, and $parent/$children/$refs—providing explanations, usage scenarios, and code examples to help developers choose the appropriate method for parent-child, sibling, or cross-level data exchange.
This article explains how to achieve native‑app‑style page transition effects in a Vue.js SPA by using the vue‑navigation component to listen to router events, applying absolute positioning, managing a custom page cache, recording scroll positions, optimizing animation performance, and handling inter‑page communication with an EventBus.
This article explains Vue.js computed properties and watchers, detailing their definitions, usage scenarios, code examples, differences, deep and immediate options, and when to prefer one over the other for reactive front‑end development.
Vant 2.0 launches with four new components, revamped documentation, enhanced theming and a slimmer bundle, while boasting 220 releases, a 98% issue‑resolution rate and plans for VantWeapp 1.0 and a Vue 3‑based Vant 3.0, reflecting the project’s marathon‑like, fast‑iteration development.
The article describes how NetEase migrated its Open Course PC site from a legacy CMS to a high‑performance Node.js SSR architecture using Egg.js with TypeScript and Nuxt.js, detailing integration, caching, logging, error monitoring, middleware ordering, and achieving 338.6 TPS on a single 4‑core server.
This article presents a collection of practical Vue.js development techniques, including centralized resize handling, global filter and component registration, route component reuse, lazy-loading strategies, vue-loader configurations, and render-function usage, each illustrated with concise code examples for more efficient and maintainable front-end projects.
The 2018 developer‑tool roundup highlights Elasticsearch for log processing, gRPC for high‑performance RPC, the CNCF ecosystem (Kubernetes, Prometheus, etc.), Python’s AI dominance, cross‑platform Mini‑Programs, VSCode’s plugin‑rich IDE, Vue.js front‑end simplicity, GraphQL’s flexible APIs, and notes a shift toward mobile, cloud‑native infrastructure and commercial open‑source licensing.
This article explains the background, requirements, core design, overall architecture, data structures, component model, property editing system, animation support, composite components, and template handling of the Maliang H5 online page‑creation platform, illustrating how it enables rapid, extensible marketing activity development for a large‑scale operation.
This article walks through setting up a .NET Core project, initializing a Vue.js application with vue‑cli, configuring webpack to output to wwwroot, and automating front‑end builds within the .NET Core build process, enabling seamless front‑end and back‑end integration.
This article walks through Vue.js's internal workflow, covering global overview, initialization and mounting, compilation stages, reactivity mechanisms, virtual DOM creation, and view updating, providing a comprehensive picture for developers seeking deeper insight into the framework.
Analyzing GitHub star growth over the past year, this article ranks the most popular JavaScript projects of 2017—highlighting Vue.js’s continued dominance, React’s strong showing, emerging tools like Puppeteer, and trends across frameworks, build tools, testing suites, and the rise of static site generators.
mpvue is a Vue.js‑based framework that lets developers write WeChat Mini Programs using familiar Vue syntax, providing component, lifecycle and event mapping to achieve high code reuse between H5 web apps and Mini Programs, evolving through three stages, supporting bidirectional reuse while noting current Vue feature limitations and best‑practice guidelines.
This article chronicles Bilibili’s 2017 front‑end transformation, detailing the shift from a backend‑centric MVC workflow to a decoupled architecture with Node middleware, Vue SSR, Docker deployment, configuration management, caching strategies, and performance testing, illustrating lessons learned and future directions.
This article explains why Vue.js is chosen over other MVVM frameworks, details its data observer mechanism with source code examples, and demonstrates component-based architecture in a real-world project, highlighting Vue's reactivity, watcher system, and future prospects.
This article reviews a series of JavaScript web‑framework comparisons, outlining why using a framework matters, summarizing the pros, cons, and future directions of Angular 2+, React + Redux, Vue.js, Dojo 2, Ember, and Aurelia to help developers and teams make informed choices.
This article details the design and implementation of Tencent Cloud's internal YY‑DSA operations platform, covering project background, frontend technology selection (Vue.js, Element‑UI, webpack), project structure, development environment, build optimizations such as code splitting, CommonsChunk, and the comparison of Dll versus externals for faster builds.
The Hermes project at Meituan‑Dianping re‑engineered its overseas vacation front‑end by separating front‑ and back‑ends, modularizing code with ES6, building a Vue‑based reusable component library, automating builds and testing, and optimizing page‑load performance through CDN caching, monitoring, and offline strategies, dramatically boosting developer productivity and user experience.
This article explains how to design and implement a Vue.js‑based website builder that lets users create multi‑page sites by dragging modules, covering requirement analysis, JSON data modeling, dynamic component rendering, state management with Vuex, and drag‑and‑drop integration.
This guide explains how to create reusable custom input components in Vue.js, covering the fundamentals of v-model, implementing custom radio buttons and checkboxes, handling single and multiple selections, and providing complete code examples for building robust form controls.
This article recounts the JD PLUS membership mobile redesign, detailing tight deadlines, complex business logic, front‑end/back‑end separation, Vue.js challenges, UIWebView performance bottlenecks, cross‑origin handling, Flexbox compatibility, ES6 polyfills, array reactivity, WebView caching, and Swiper integration, and how each issue was resolved.
Learn how Nuxt.js extends Vue.js to provide seamless server‑side rendering, from installation and project scaffolding to directory structure, rendering flow, middleware, asyncData handling, routing conventions, and configuration tips, enabling SEO‑friendly, high‑performance web applications.
A correction notice clarifies that the previous Vue.js form configuration article contained an error in the 'Implementation – External Elements' section, providing the updated HTML snippet and explaining that Vue.js slots should be used as child elements within components, with an apology to readers.
This article explains how to create flexible, schema‑driven web forms using Vue.js, covering requirements definition, backend data injection, component architecture, functional controls, event handling, and validation logic to replace traditional server‑rendered forms.
AT-UI is a Vue.js‑based UI component library that offers independent styling, npm‑webpack workflow, and easy global or local component usage, supporting modern browsers, IE9+, and Electron, with clear installation and contribution guidelines for rapid PC web development.
This article examines common mistakes when nesting Vue.js components—such as overly deep parent‑child structures and cumbersome event communication—and demonstrates how to streamline component design using reusable child components and the slot content‑distribution mechanism, complete with practical code examples and visual diagrams.
Through a detailed source‑code walkthrough, the article explains how Vuex injects the store via a global mixin, builds a hierarchical module tree, binds and implements dispatch and commit methods, enforces strict‑mode mutation checks with a hidden Vue instance, and enables time‑travel debugging by recording mutations and replacing state.
This article provides a comprehensive technical overview of Vue.js, explaining why MVVM frameworks are needed, the advantages of Vue, and detailing the internal mechanisms of its observer, compiler, watcher, caching system, and dependency collection, while offering practical tips for reading open‑source code.
This comprehensive guide walks you through Vue.js fundamentals, installation via script tags or the Vue CLI, component creation, handling common pitfalls, integrating webpack, using .vue single‑file components, vue‑loader, vue‑router, Vuex, and hot‑reloading, plus curated resources for deeper learning.
Vue.js 2.0 initializes a component via the _init method, merges options, and mounts it with $mount, which creates a render function—whether from a custom function, template, or element—producing a Virtual DOM VNode that the patch algorithm diffs against the previous VNode to efficiently update the real DOM.
This tutorial walks you through creating a simple timer application with Vue 2.0, Vue‑Router, Vuex and Webpack, highlighting the differences from Vue 1.0, showing project setup, file structure, core code snippets, and best practices for state management.
In this fifth Quick Q&A episode, the author answers several front‑end questions covering how to make a background image adapt to a container, CSS animation compatibility across browsers, clearfix techniques, learning resources for JavaScript, choosing a Vue.js framework, and practical career advice for aspiring developers.
This article introduces Vue.js fundamentals, compares its similarities and differences with React, demonstrates a sample project structure with component examples, and guides readers on obtaining the demo repository and exploring Vue 2.0 enhancements, providing a practical hands‑on overview for front‑end developers.
This tutorial walks you through the reasons for using SPA, why Vue.js is a lightweight alternative to React, how to set up the Node environment, configure Webpack, create components, manage routing, handle component lifecycles, and implement nested routes with practical code examples.
