This tutorial demonstrates how to create a full‑stack server‑monitoring web app by setting up a Vue‑based frontend with Element and ECharts, and a Python Flask backend that collects load and disk usage data via Paramiko, stores it in SQLite, and serves it through a JSON API.
This article explains Vue’s provide/inject API, how it enables ancestor components to share data with any descendant, compares it to Vuex for global state, shows practical code examples, discusses limitations and best‑practice guidelines, and demonstrates its use in component libraries like Element UI.
This tutorial walks through creating a web‑based server monitoring tool that tracks CPU load and disk usage, using Vue.js with Element UI and Echarts for the frontend and a Python Flask backend with SQLite for data storage and API delivery.
This article provides a comprehensive guide to Vue’s slot mechanism, covering default slots, named slots, and scoped slots, explains the new v-slot syntax introduced in Vue 2.6, demonstrates practical component implementations with code examples, and highlights important considerations and advanced extensions.
This article explains the background, architecture, implementation details, performance evaluation, and practical usage of Kbone—a solution that adapts Vue‑based web applications to run as WeChat mini‑programs by simulating DOM, using custom components, and providing a compatible event system.
Kbone is an open-source framework by WeChat enabling Vue apps to compile to both web and mini‑programs via a fake DOM adapter, allowing reuse of Vue code, custom components, and minimal changes, with performance acceptable for typical mini‑program pages.
Vue 3 introduces substantial performance gains, a smaller bundle size, tree‑shakable global APIs, a proxy‑based reactivity system, and experimental time‑slicing features, all of which make modern, mobile‑first web development faster and more efficient.
This article explains how Vue 3.0 rewrites its reactivity system using Proxy and Reflet, introduces the reactive, effect, and computed APIs, compares them with MobX, and details the resulting changes for arrays, collections, lazy observation, and IE compatibility.
This article describes how Ctrip's marketing team built the Legao platform—a visual, component‑based front‑end system that enables rapid configuration of thousands of activity pages through reusable business, web, and activity‑level components, detailing its architecture, technology stack, SDK, and dynamic form system.
This article explains the concept of skeleton screens, demonstrates how to use the CSS :empty selector, and provides a step‑by‑step Vue implementation—including route‑aware class switching—to reduce white‑screen time on slow networks.
At a GitHub China meetup, the author reflects on Rich Harris’s critique of React, compares mutable versus immutable reactivity in Vue and React, examines functional programming foundations, and proposes a unified approach integrating mutable, immutable, and reactive patterns to transcend framework paradigm disputes.
This article examines the evolution from backend template engines to SPA, highlights SPA's SEO and first‑paint drawbacks, and presents a detailed Vue server‑side rendering implementation with optimization techniques, degradation strategies, and performance results showing over 300% faster first‑screen rendering.
The article introduces Luban, a visual page‑building platform created by the Zhengcaiyun front‑end team to address growing business demands, reduce repetitive coding, improve deployment speed, and empower both developers and operations through component‑based, static‑site generation using Vue, Node, and MySQL.
This article compares the three most popular front‑end technologies—Angular, React, and Vue—examining their nature as libraries or frameworks, lifecycle, community support, flexibility, performance, and ideal use cases to help developers decide which solution best fits their project requirements.
This article explains how to create a high‑stability image magnifier in Vue by calculating mask positions based on mouse events, moving the background image accordingly, and optimizing performance with initialization checks and scroll handling, providing full source code and usage instructions.
This article compares Angular, React, and Vue, examining their core philosophies, required patterns, functional programming implications, and practical suitability for business applications, helping developers choose the most appropriate front‑end framework for their projects.
This article chronicles the architectural evolution of a web‑based mini‑program engine, detailing the challenges of sandboxing Vue, restricting unsafe tags, handling performance and native capability limits, and ultimately adopting a dual‑thread model to achieve security and control while preserving developer experience.
This article walks through the complete compilation pipeline of a Vue Single‑File Component using vue‑loader v15, examining the VueLoaderPlugin, the pitcher loader, and each processing stage with concrete code examples and configuration snippets.
Learn how to create a Vue plugin that captures a page with html2canvas and generates a PDF using jsPDF, covering required dependencies, plugin implementation, installation steps, and usage example to export dynamic table content as a PDF file.
This article explores kbone's ability to compile Vue‑based web code into WeChat mini‑programs, detailing its build and runtime mechanisms, component adaptation, style compatibility challenges, practical implementation experiences, and tips for integrating kbone into new or existing projects.
This article walks through the design and implementation of a Node‑based command‑line tool that generates React or Vue project scaffolds, covering initialization, script development, template downloading, local testing, npm publishing, and usage instructions.
The author recounts how, after his company closed, he built a lightweight Spring Boot‑Vue blog project, iterated it into a more complex human‑resource management system, documented each feature, released it on GitHub, and eventually saw it climb the GitHub Trending list, sharing lessons learned and advice for newcomers.
This article explains the principle of two-way data binding in Vue's MVVM architecture, detailing how Object.defineProperty is used to create observers that track property changes, notify watchers via a dependency collector, and how the compile process links view directives to model updates.
This article presents a curated list of ten popular, free, open‑source admin dashboard UI frameworks—such as AdminLTE, vue‑Element‑Admin, Tabler, and others—detailing their GitHub stars, repository links, core technologies, and visual screenshots to help developers quickly choose a suitable backend control panel solution.
This article analyzes a bug where rapid route switching in a Vue H5 project caused data from different routes to mix, explains how Axios CancelToken works, shows the implementation of request cancellation via interceptors, and discusses deeper insights and further possibilities for frontend developers.
This article explains how to create a cross‑platform desktop client for uploading local resources to S3‑backed CDN using Electron, Vue, and lowdb, covering UI design, project structure, main‑renderer process communication, persistent storage, command‑line integration, packaging, and update handling.
This article explains how to build a front‑back end separated application using Spring Boot for the backend and Vue.js for the frontend, covering JSON APIs, CORS interception, Shiro security integration, custom session management, and two deployment strategies with code examples.
This article explores the development of NutUI 2.0, a Vue component library, detailing why Webpack was chosen over Rollup, how to configure UMD builds, manage external Vue dependencies, and leverage tree‑shaking to reduce bundle size.
The article describes a pipeline that converts a Vue component into a React component by parsing the template, script and style with vue‑template‑compiler and Babel, traversing the AST to map Vue data, props, computed, methods and lifecycle hooks to React state, defaultProps and lifecycle methods, and generating JSX from directives such as v‑if, v‑for and event bindings, thereby reducing rewrite effort and supporting targets.
This article presents a technical design for a multi‑platform shop‑decoration system that shares data via React context, reuses Vue‑based preview components through an iframe, synchronizes updates with a postMessage wrapper, and implements drag‑and‑drop using vuedraggable, providing a scalable solution for PC, H5, and mini‑programs.
Dubbo Admin 0.1, a freshly refactored standalone project, replaces the old Webx backend with Spring Boot, adopts Vue and Vuetify for the UI, integrates Swagger, and introduces updated configuration, tag routing, application‑level service governance, and metadata‑driven testing to fully support Dubbo 2.7 features.
This guide walks you through the fundamentals of Nuxt.js server‑side rendering, covering installation, project scaffolding, routing, asset handling, layouts, middleware, plugins, and configuration to build fast, SEO‑friendly Vue applications.
This article explains the origins and problems GraphQL solves, describes its core concepts and advantages, and provides step‑by‑step instructions for integrating GraphQL into a Vue front‑end with Apollo as well as setting up a simple Node.js GraphQL server, complete with code examples.
The article details how Ctrip's flight ticket front‑end team introduced Node.js for front‑back separation, built a Vue‑based H5 architecture with PM2, Express and standard RESTful APIs, then migrated many services to GraphQL, achieving modularity, performance under 50 ms and handling millions of daily requests.
Learn how to streamline Vue form development by applying five practical techniques—including universal validation, preventing duplicate submissions, managing loading states, resetting data on reopen, and prompting users before accidental navigation—each illustrated with Element‑UI code snippets to reduce bugs, cut communication overhead, and accelerate project delivery.
Vue’s creator reflects on the React vs Vue debate, explaining each framework’s origins, design philosophies, performance nuances, community adoption, and why developers should focus on personal growth rather than proclaiming one technology superior.
Mpx is an enhanced mini‑program framework that directly extends native mini‑program syntax with Vue‑style development tools, Webpack‑based compilation, reactive data handling, component‑level setData optimization, Vuex‑compatible state management, and team‑oriented features, delivering superior developer experience and performance for WeChat and Alipay apps.
This guide walks through using vue-awesome-swiper in Vue projects, covering version differences, required CSS imports, component setup, and key configuration options such as slidesPerView, centeredSlides, and the coverflow effect, plus progress callbacks and code snippets for dynamic flash‑sale carousels.
This guide explains how to configure a Vue 2.x project to output source‑map files to a custom directory by leveraging Webpack’s SourceMapDevToolPlugin, adjusting productionSourceMap settings, and fine‑tuning optimization options for reliable Sentry integration.
This article walks through building an identical ToDo application with React and Vue, comparing their project structures, data mutation mechanisms, component communication, event handling, and code examples, helping developers understand the practical differences between the two popular frontend frameworks.
This article explains the mpvue framework, compares Vue and mpvue lifecycles, shows practical verification with navigation scenarios, discusses common pitfalls when fetching data, and concludes with recommendations for efficient mini‑program development.
This article walks through creating a mobile‑friendly WeChat web app using Vue and the VUX UI library to integrate Azure DevOps notifications, covering project initialization, dependency installation, component registration (both local and global), and deployment screenshots.
The article explains how evolving runtime interaction requirements have shifted front‑end development from simple jQuery scripts to modern declarative frameworks like Vue, React and Angular, detailing the differences between imperative and declarative approaches, rendering mechanisms, and the role of virtual DOM.
This article explains Vue's reactivity system by recreating a simple reactivity engine using JavaScript, covering dependency collection, watcher functions, observer classes, and Object.defineProperty to track and update values automatically when data changes.
The article describes an automated continuous‑integration framework for Xianyu’s iOS multi‑bundle projects that links Aone requirements to GitLab commits and Mojianlun builds via a SpringBoot/Vue platform, using webhook‑driven packaging, scoped testing, rate‑limited queues and statistics to reduce manual effort and errors.
This guide explains how to create a Vue‑based comment system, mount it inside a traditional jQuery page, package it as a UMD library with Vue‑CLI 3.0, manage state with Vuex, integrate Element‑UI components, and extend Axios for JSONP support.
To address Meituan‑Dianping’s exploding demand for test phones, we rebuilt OpenSTF‑based platform with modular Agent, Server, and MySQL storage, upgraded to Vue 2, added dynamic screen quality, reservation, API integration, mock and inspector tools, now supporting 300 devices for 500 developers daily and planning iOS expansion.
A former communications engineering graduate shares a detailed chronicle of ten front‑end interview experiences across startups, small firms, mid‑size companies, and a pre‑IPO e‑commerce firm in Shanghai, highlighting interview questions, personal reflections, and actionable lessons for aspiring developers.
By using Webpack’s CommonsChunkPlugin to extract node_modules into a vendor chunk, configuring externals to load Vue and Vuetify from a CDN, and converting non‑critical components to async imports, a Vuetify‑based app reduces its first‑screen bundle by hundreds of kilobytes, improves caching, and speeds initial load.
This article introduces Weex as a simple, high‑performance cross‑platform solution that leverages Vue and W3C standards to build native mobile apps, explains its architecture, page structure, components, layout, lifecycle, and shares practical experiences and best practices for integrating Weex in mobile office applications.
This article explains how to use the HTML5 video tag on mobile web pages, covering common attributes, inline versus fullscreen playback on iOS and Android, dynamic source updates in Vue, live‑streaming protocols with video.js, and practical fixes for background‑audio and layering problems.
This article explains how to improve front‑end performance by separating business code from libraries, using on‑demand async loading, configuring CommonsChunkPlugin, externalizing large dependencies, and applying HTTP/2 optimizations, all demonstrated with a real Vue/Vuetify project.
This article explains how to build a reusable Vue component for mobile drag‑and‑drop, covering Vue's advantages, component structure, touch‑event handling, data‑driven updates, optimization techniques, and differences between mobile and PC implementations, with complete code examples.
This article shares the practical experience of creating a Vue 2 mobile UI component library, covering the choice of scaffolding tools, Webpack UMD packaging configuration, component classification, CSS scoping decisions, on‑demand custom builds, and the adoption of SVG‑based icon solutions.
Vant 1.0, the open‑source mobile Vue component library maintained by Youzan, delivers ultra‑light components averaging 8.8KB, embraces a lightweight, fast‑iteration, and ecosystem‑centric philosophy, and showcases impressive community contributions and tooling support for modern front‑end development.
The 2017 JavaScript State of the Nation survey of 23,000 developers uncovers the rise of React, shifting roles of Angular and Vue, salary‑driven technology choices, the surge of GraphQL and TypeScript, and how JavaScript is expanding far beyond the browser into back‑end and IoT.
This article chronicles Bilibili’s front‑end evolution in 2017, detailing the shift from a backend‑centric MVC model to front‑back separation, the adoption of Node middle‑layers, Vue and React SSR, Docker deployment, caching strategies, and subsequent refactoring to improve performance and scalability.
The 2017 npm State of JavaScript report analyzes the popularity and growth of major front‑end frameworks—React, Preact, Angular, Ember, Vue, and Backbone—showing dramatic shifts, rapid adoption rates, and guidance for developers choosing the right tool for their projects.
Explore the 2018 JavaScript landscape, from Vue’s rising popularity and React’s Next.js ecosystem to emerging tools like GraphQL, Storybook, and WebAssembly, while uncovering essential learning resources and why developers should adopt these trends to stay competitive.
This article chronicles Bilibili’s transition from a traditional MVC workflow to a modern front‑end/back‑end separation, detailing the adoption of Node middle‑layers, Vue SSR, architecture refactoring, deployment strategies, performance testing, and lessons learned throughout 2017.
This tutorial explains why and how to build multi‑page Vue applications using vue‑cli and webpack, covering project setup, configuration files, webpack entry and output handling, HTML generation, asset management, and performance optimizations for both development and production environments.
At the end of 2017, this guide examines the strengths, weaknesses, and future prospects of major front‑end frameworks—including Angular 2+, React + Redux, Vue.js, Dojo 2, Ember.js, and Aurelia—offering practical advice on when to adopt each based on team size, project needs, and ecosystem support.
Based on responses from over 23,000 developers, this survey uncovers the latest JavaScript ecosystem trends—including the dominance of React, the evolving roles of Angular and Vue, rising interest in GraphQL, salary impacts of framework choices, and the expanding use of JavaScript beyond the browser.
This article compiles and compares a wide range of current front‑end UI frameworks—including mobile, PC, and hybrid solutions—by summarizing their core features, GitHub statistics, CDN import methods and providing brief personal insights to help developers select the most suitable library.
This article walks through the development of a Vue‑based single‑page application for the JD Car Maintenance project, covering why Vuex was chosen, its core concepts, store implementation, state persistence, cross‑origin handling, Axios/JSONP requests, code refactoring, lazy loading, and component extraction to improve maintainability and performance.
This article explains the concept and implementation of virtual DOM, focusing on Vue's use of the Snabbdom algorithm, detailing its node structure, creation, update process, lifecycle hooks, and code examples to illustrate how virtual DOM optimizes front‑end performance.
This article walks through the design, architecture, and implementation of JD's E‑Wei ticket‑handling platform, detailing the Vue single‑page application structure, component organization, routing, mock API usage, CORS handling, and deployment insights for front‑end engineers.
This article provides a comprehensive overview of the front‑end development workflow, explaining core concepts like HTML, CSS, JavaScript, and detailing essential tools such as npm, Babel, Gulp, Webpack, and popular frameworks like React and Vue, while addressing their roles and interactions.
This guide explains how to install the Babel JSX plugin, write JSX inside Vue 2 components, covers key syntax differences, highlights important considerations, and suggests extensions like vue-class-component for more elegant component definitions.
This week’s front‑end roundup covers Baidu’s new Vue‑based PWA LAVAS and Web AR support, a decline in global PC shipments, Taobao’s group‑buy launch, upcoming async CSS in Webpack, MobX 3.2.0, China’s first smart parking system, Apple’s open‑sourced Swift Migrator, Let’s Encrypt wildcard certificates, Facebook camera updates, and Huawei’s 5G trial talks with India.
This article examines how modern frontend frameworks—React, Angular 1, Angular 2, and Vue—detect data changes and implement batch updates, comparing their virtual DOM diffing, dirty checking, zone.js, and asynchronous queues to reveal each library’s underlying change‑detection strategy.
This tutorial walks you through the entire process of creating a basic commercial website front‑end—from gathering requirements and designing interactions to setting up a Vue‑webpack project, installing iView components, and launching the site—in roughly one hour of work.
This article walks through the author's experience of exploring WeChat Mini Programs as a front‑end framework, comparing it to Vue and React Native, and provides a step‑by‑step tutorial for creating a basic catalog page with code snippets and screenshots.
This article walks through the practical differences and best‑practice setups for building Weex applications on web and native platforms, covering webpack configurations, preprocessors, style quirks, navigation, data passing, image handling, incremental updates, and production tips.
This article presents a universal frontend event tracking (埋点) solution designed for Baidu Takeaway's sales CRM platform, detailing its background, comparison of tracking methods, a declarative approach using Vue directives and MutationObserver mixins, support for legacy jQuery, and practical usage and results.
This article outlines a comprehensive front‑end engineering workflow covering modularization, componentization, standardization, and automation, then details technology choices such as Vue, Koa, Sass, and webpack, and provides practical project configuration tips for CSS, webpack, Babel, and CI/CD.
The author recounts attending Ele.me's front‑end technology conference, summarizing seven sessions covering PWA implementation, evolving front‑back collaboration, dependency health monitoring, Vue usage, Flow and type theory, design perspectives on Element, and the exploration of a visual document editor, while sharing personal impressions.
This article explains how to implement server‑side rendering (SSR) for Vue.js applications, covering the underlying concepts, required code setup, Vuex state handling, webpack configuration, and deployment steps to improve SEO for single‑page applications.
This article reviews recent advances in front‑end development, compares popular frameworks such as AngularJS, EmberJS, ReactJS and VueJS, examines their evolution, discusses user and developer needs, and offers guidance on which technologies to invest in for the coming years.
