Tagged articles

frontend

3211 articles · Page 28 of 33
Yuewen Technology
Yuewen Technology
Aug 8, 2018 · Frontend Development

How Frontend Zip Compression Can Boost Performance and Reduce Server Load

This article explores the history of ZIP, the challenges of exporting large Excel files from PHP front‑ends, and how using zip.js with HTML5 File API and web workers enables a half‑asynchronous, client‑side compression workflow, outlining its benefits, limitations, and practical considerations for frontend developers.

Web Workersasynchronous exportfrontend
0 likes · 12 min read
How Frontend Zip Compression Can Boost Performance and Reduce Server Load
Java Backend Technology
Java Backend Technology
Aug 3, 2018 · Frontend Development

Why Frontend‑Backend Separation Matters: From JSP to Modern Node.js

This article walks through the evolution of front‑end architecture—from tightly coupled JSP/Servlet setups, through semi‑separated Ajax‑driven pages, to fully separated front‑end/back‑end designs with Node.js—highlighting their advantages, drawbacks, and practical lessons for developers.

JSPNode.jsWeb Development
0 likes · 13 min read
Why Frontend‑Backend Separation Matters: From JSP to Modern Node.js
MaoDou Frontend Team
MaoDou Frontend Team
Jul 31, 2018 · Frontend Development

Is React setState Synchronous or Asynchronous? A Practical Guide

This article explains when React's setState behaves synchronously or asynchronously, how batch updates are merged into a single render, and the proper way to retrieve the updated state using the callback parameter, illustrated with clear diagrams and code examples.

JavaScriptReActfrontend
0 likes · 3 min read
Is React setState Synchronous or Asynchronous? A Practical Guide
360 Tech Engineering
360 Tech Engineering
Jul 30, 2018 · Frontend Development

Goodbye jQuery, My Old Friend

Reflecting on jQuery’s rise, dominance, and eventual decline, this article traces the library’s history, its impact on front‑end development, compares it with contemporary frameworks, and offers advice on understanding underlying JavaScript fundamentals before relying on any library.

FrameworksWeb Developmentfrontend
0 likes · 9 min read
Goodbye jQuery, My Old Friend
CSS Magic
CSS Magic
Jul 27, 2018 · Frontend Development

Fix Common ESLint Warnings in Existing JS Code (Part 3)

This article explains how to resolve the ESLint "no‑empty" and "no‑empty‑function" warnings by refactoring empty blocks, adding explanatory comments, using noop helpers, and validating callbacks, providing concrete code examples and step‑by‑step reasoning.

ESLintJavaScriptLinting
0 likes · 6 min read
Fix Common ESLint Warnings in Existing JS Code (Part 3)
JD Retail Technology
JD Retail Technology
Jul 25, 2018 · Frontend Development

Design and Architecture of JD.com’s Tongtian Tower Visual Activity Page Builder

The article explains how JD.com’s Tongtian Tower platform enables non‑technical operators to create activity pages through a React‑based visual editor, detailing its background, design goals, component architecture, template definition, data handling, quality assurance measures, and future development directions.

JD.comPlatform designReAct
0 likes · 9 min read
Design and Architecture of JD.com’s Tongtian Tower Visual Activity Page Builder
360 Tech Engineering
360 Tech Engineering
Jul 23, 2018 · Frontend Development

Comprehensive Guide to Web Performance Optimization

This article provides a comprehensive overview of web performance optimization for frontend developers, covering metrics and goal setting, code and DOM optimizations, static asset compression, delivery techniques like async loading and resource hints, build strategies such as tree‑shaking and SSR, and monitoring tools.

Build OptimizationOptimizationWeb Performance
0 likes · 16 min read
Comprehensive Guide to Web Performance Optimization
JD Tech
JD Tech
Jul 23, 2018 · Frontend Development

Design and Architecture of JD's "Tongtian Tower" Visual Activity Page Builder Platform

This article explains the background, requirements, architectural design, technology selection, component structure, template definition, data handling, quality assurance measures, and future roadmap of JD's internal visual activity page builder platform, Tongtian Tower, highlighting its React‑based frontend implementation and open‑extension strategy.

JDReActfrontend
0 likes · 9 min read
Design and Architecture of JD's "Tongtian Tower" Visual Activity Page Builder Platform
58 Tech
58 Tech
Jul 18, 2018 · Frontend Development

Frontend Architecture of 58 MicroChat: Multi‑Platform Design and Implementation

The article describes the layered front‑end architecture of 58 MicroChat, covering its network, SDK, UI, integration, storage, security, polyfill, and quality‑monitoring modules, as well as the message center design, cross‑platform compatibility strategies, and ongoing quality‑monitoring practices.

PolyfillQuality Monitoringarchitecture
0 likes · 12 min read
Frontend Architecture of 58 MicroChat: Multi‑Platform Design and Implementation
Architects Research Society
Architects Research Society
Jul 17, 2018 · Frontend Development

Performance Issues and Mitigation Strategies for Salesforce Lightning Experience

This article outlines common geographic, device, browser, and Salesforce org configuration problems that cause slow page loads in Lightning Experience and provides practical mitigation steps such as network latency testing, browser benchmarking, disabling unnecessary plugins, and optimizing Visualforce and Lightning page designs.

BrowserLightning ExperienceOptimization
0 likes · 6 min read
Performance Issues and Mitigation Strategies for Salesforce Lightning Experience
Qunar Tech Salon
Qunar Tech Salon
Jul 17, 2018 · Frontend Development

Adapting WeChat Mini Program Component Model to the React Paradigm

This article examines the challenges of using WeChat Mini Programs, proposes a React‑style component architecture by mapping Mini Program concepts such as Component, Page, and App to React's state, lifecycle, and JSX, and provides concrete code examples for definition, lifecycle handling, styling, templating, and configuration.

ComponentJavaScriptReAct
0 likes · 6 min read
Adapting WeChat Mini Program Component Model to the React Paradigm
网易UEDC
网易UEDC
Jul 16, 2018 · Frontend Development

Mastering SVG Animations: From Code to Interactive H5 Effects

This article walks through the fundamentals of SVG, explains its advantages over raster formats, demonstrates how to create shapes and apply SMIL animations with code examples, and shows practical techniques such as masking, referencing, and animating transforms to build rich, lightweight web graphics.

SMILWeb Developmentanimation
0 likes · 24 min read
Mastering SVG Animations: From Code to Interactive H5 Effects
ITPUB
ITPUB
Jul 9, 2018 · Frontend Development

What I Learned from 10 Front‑End Interviews in Shanghai: Real Stories & Practical Tips

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.

JavaScriptShanghaiVue
0 likes · 15 min read
What I Learned from 10 Front‑End Interviews in Shanghai: Real Stories & Practical Tips
网易UEDC
网易UEDC
Jul 9, 2018 · Frontend Development

Unlocking UI Metaphor Design: Types, Methods, and Real‑World Examples

This article explains the concept of UI metaphor design, categorizes common visual, auditory, and haptic metaphors, and outlines four design approaches—conceptual, feature‑based, structural, and behavioral—providing concrete examples and illustrations to inspire effective interface design.

UI designfrontendinteraction design
0 likes · 9 min read
Unlocking UI Metaphor Design: Types, Methods, and Real‑World Examples
QQ Music Frontend Team
QQ Music Frontend Team
Jul 8, 2018 · Frontend Development

Why WebAssembly Could Outperform JavaScript: Load Times, Execution, and More

This article examines WebAssembly’s core features—loading speed, execution performance, memory model, garbage collection, API access, multithreading, and portability—comparing them to JavaScript, and discusses suitable use cases such as high‑CPU tasks, gaming, and image processing, while noting current limitations and future prospects.

JavaScriptMemory ModelWebAssembly
0 likes · 11 min read
Why WebAssembly Could Outperform JavaScript: Load Times, Execution, and More
Meituan Technology Team
Meituan Technology Team
Jul 5, 2018 · Backend Development

Incremental Update Practices and Go‑Based Performance Optimization at Meituan Finance

Meituan Finance reduced user churn by replacing Node‑based diff generation with a Go‑powered incremental‑update service that uses lightweight goroutines, a three‑layer CDN/API/compute architecture, and pre‑warmed patches, achieving 99.97 % success, 64.9 % incremental updates and roughly 164 KB daily bandwidth savings per user.

GoIncremental Updatearchitecture
0 likes · 19 min read
Incremental Update Practices and Go‑Based Performance Optimization at Meituan Finance
360 Tech Engineering
360 Tech Engineering
Jul 5, 2018 · Frontend Development

SpriteJS: Redefining the Canvas API for Cross‑Platform Frontend Development

SpriteJS, an open‑source cross‑terminal Canvas library from 360 Qiwuchuan, simplifies animation creation by wrapping Canvas APIs in a DOM‑like model, offering event handling, Web Animation support, caching strategies, and integration with multiple graphics and physics engines for data visualization and lightweight games.

CanvasSpriteJSWeb animation
0 likes · 7 min read
SpriteJS: Redefining the Canvas API for Cross‑Platform Frontend Development
Java Architect Essentials
Java Architect Essentials
Jun 28, 2018 · Frontend Development

Should Small Teams Adopt Front‑End Separation? Lessons from MVC to Node.js

From legacy JSP‑based MVC to semi‑separated Ajax‑driven pages and finally fully separated front‑end architectures using Node.js, this article examines each stage’s structure, advantages, and drawbacks, arguing that small‑to‑mid‑size companies must weigh resource constraints, performance, and maintenance before fully embracing front‑end separation.

AJAXMVCNode.js
0 likes · 12 min read
Should Small Teams Adopt Front‑End Separation? Lessons from MVC to Node.js
Yuewen Frontend Team
Yuewen Frontend Team
Jun 26, 2018 · Frontend Development

Why 16px Should Be the Default Font Size for Front‑End Design

The article explores how front‑end typography standards—covering base font size, font‑scale formulas, and line‑height rules—can be derived from visual ergonomics, mathematical ratios, and practical engineering constraints, ultimately recommending 16 px as the optimal base size and a line‑height of font‑size + 8.

CSSDesign GuidelinesTypography
0 likes · 17 min read
Why 16px Should Be the Default Font Size for Front‑End Design
21CTO
21CTO
Jun 22, 2018 · Fundamentals

Why Tech Hype Misleads Developers: Lessons from Over‑Promoted Trends

The article warns developers about the dangers of blindly following flashy technologies—such as over‑abstracted patterns, NoSQL hype, endless scalability promises, micro‑services mania, and agile buzzwords—by highlighting real‑world pitfalls and urging thoughtful, purpose‑driven engineering decisions.

NoSQLfrontendmicroservices
0 likes · 6 min read
Why Tech Hype Misleads Developers: Lessons from Over‑Promoted Trends
Java Architect Essentials
Java Architect Essentials
Jun 21, 2018 · Frontend Development

Setting Up a React Development Environment on macOS

This guide walks through installing Node.js, configuring npm with a Chinese mirror, and using create‑react‑app to quickly create and run a React project on macOS, including all necessary command‑line steps and code snippets.

Node.jsReActcreate-react-app
0 likes · 6 min read
Setting Up a React Development Environment on macOS
Tencent Cloud Developer
Tencent Cloud Developer
Jun 20, 2018 · Fundamentals

Cross‑Disciplinary Development: A Front‑End Engineer’s Perspective on Full‑Stack Skills

Yu Guo argues that strong front‑end engineers naturally evolve into full‑stack developers by leveraging their UI‑centric product sense, continuous learning ability, and core technical skills—expanding from HTML/CSS/JS to Node.js back‑end, React‑Native mobile, algorithmic fundamentals, and scalable databases like MongoDB—while emphasizing modular collaboration and practical project‑driven learning.

Full-Stackbackendfrontend
0 likes · 13 min read
Cross‑Disciplinary Development: A Front‑End Engineer’s Perspective on Full‑Stack Skills
Full-Stack Internet Architecture
Full-Stack Internet Architecture
Jun 20, 2018 · Frontend Development

A Comprehensive Introduction to ReactJS: Virtual DOM, Component Architecture, and Hands‑On Examples

This article provides a detailed overview of ReactJS, covering its origins, virtual DOM mechanism, component‑based architecture, common misconceptions, setup steps, JSX syntax, component properties, state management, lifecycle methods, and practical code examples for building interactive web interfaces.

Component ArchitectureJSXJavaScript
0 likes · 14 min read
A Comprehensive Introduction to ReactJS: Virtual DOM, Component Architecture, and Hands‑On Examples
360 Zhihui Cloud Developer
360 Zhihui Cloud Developer
Jun 20, 2018 · Frontend Development

Unlock Stunning Canvas Animations with SpriteJS – A Complete Beginner’s Guide

This article introduces SpriteJS, a cross‑platform canvas library from 360 Qiwang Team, showing how to create structured UI, draw shapes, apply transitions, use the Web Animation API, work with textures, paths, groups, events, D3 integration, physics engines and particle systems, all with practical JavaScript code examples.

CanvasGraphicsJavaScript
0 likes · 32 min read
Unlock Stunning Canvas Animations with SpriteJS – A Complete Beginner’s Guide
Ctrip Technology
Ctrip Technology
Jun 19, 2018 · Frontend Development

Understanding React Fiber: Architecture, Scheduling, and Reconciliation

This article explains why React Fiber was introduced, describes its core concepts such as the fiber tree, work‑in‑progress tree, double buffering, priority scheduling, and lifecycle changes, and summarizes the new capabilities it brings to improve UI performance and responsiveness.

FiberPerformanceReAct
0 likes · 10 min read
Understanding React Fiber: Architecture, Scheduling, and Reconciliation
Tencent Cloud Developer
Tencent Cloud Developer
Jun 19, 2018 · Frontend Development

Future‑Oriented Full‑Stack Development: Trends in Programming Languages, Frameworks, and Learning Strategies

Yu Guo’s talk surveys future‑oriented full‑stack trends—rising languages like Python, mobile‑first Swift, shifting frameworks from jQuery to React/Vue, evolving build tools, and practical learning strategies such as deliberate practice, skill‑model mapping, and algorithmic optimizations—emphasizing continual adaptability for developers.

Full-StackJavaScriptLearning
0 likes · 11 min read
Future‑Oriented Full‑Stack Development: Trends in Programming Languages, Frameworks, and Learning Strategies
ITPUB
ITPUB
Jun 16, 2018 · Frontend Development

From JSP MVC to Full Front‑Back Separation: When Is It Worth It?

The article walks through the evolution of front‑end development from traditional JSP/Servlet MVC through semi‑separated Ajax‑driven pages to fully separated front‑back architectures, highlighting each stage’s structure, advantages, drawbacks, and the practical considerations that make full separation risky for small‑to‑medium projects.

AJAXMVCNode.js
0 likes · 12 min read
From JSP MVC to Full Front‑Back Separation: When Is It Worth It?
Architecture Digest
Architecture Digest
Jun 14, 2018 · Frontend Development

Key Concerns and Challenges for Front‑End Architecture

The article examines front‑end architecture by highlighting its primary focus on user experience, performance, reliability, tooling choices, and engineering difficulties such as monitoring and caching, arguing that front‑end architects must balance these factors just like their back‑end counterparts.

MonitoringPerformanceTooling
0 likes · 6 min read
Key Concerns and Challenges for Front‑End Architecture
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Jun 8, 2018 · Frontend Development

Understanding the Front‑End Career Ceiling and Paths for Advancement

The article examines why front‑end developers often hit a career ceiling due to low entry barriers and limited backend knowledge, and outlines practical solutions and five distinct career routes—including senior front‑end, full‑stack, management, product, and entrepreneurship—to help break through that ceiling.

Full-StackTechnologycareer-development
0 likes · 7 min read
Understanding the Front‑End Career Ceiling and Paths for Advancement
Java Backend Technology
Java Backend Technology
Jun 7, 2018 · Information Security

How to Secure API Calls with End-to-End Encryption Using Spring Boot

This article explains why API security is crucial in front‑end/back‑end separated systems and provides practical measures—including HTTPS, request signing, SSL pinning, and full request/response AES encryption—along with a Spring Boot starter and JavaScript Axios interceptor to protect data in transit.

AESAPI securityEncryption
0 likes · 8 min read
How to Secure API Calls with End-to-End Encryption Using Spring Boot
Yuewen Frontend Team
Yuewen Frontend Team
May 28, 2018 · Frontend Development

Master Simple Easing: Plug‑and‑Play Animation Algorithm for UI

This article introduces a lightweight easing algorithm that moves an element by half the remaining distance each frame, provides a requestAnimationFrame polyfill, a reusable Math.easeout function, and shows real‑world usage in Qidian's scroll‑to‑top and other UI effects.

EasingJavaScriptUI
0 likes · 12 min read
Master Simple Easing: Plug‑and‑Play Animation Algorithm for UI
ITFLY8 Architecture Home
ITFLY8 Architecture Home
May 26, 2018 · Frontend Development

Why Front‑End/Back‑End Separation Fails and How to Do It Right

The article examines the evolution of web development models, explains why naive front‑end/back‑end separation often leads to problems, and offers practical guidelines—including team roles, RESTful API design, collaboration patterns, and deployment strategies—to implement a successful separation architecture.

RESTfularchitecturebackend
0 likes · 8 min read
Why Front‑End/Back‑End Separation Fails and How to Do It Right
JD Retail Technology
JD Retail Technology
May 24, 2018 · Frontend Development

Understanding PWA Caching: Principles, Performance Benefits, and Strategies

This article explains why traditional H5 pages perform poorly compared to native apps, introduces Progressive Web Apps (PWA) as a solution, details how service workers enable offline caching, presents real‑world performance comparisons, and reviews common cache strategies such as cache‑first, network‑first, stale‑while‑revalidate, cache‑only, and network‑only.

Cache strategiesPWAPerformance
0 likes · 7 min read
Understanding PWA Caching: Principles, Performance Benefits, and Strategies
360 Tech Engineering
360 Tech Engineering
May 21, 2018 · Frontend Development

Weekly Tech Newsletter Summary – Frontend Development Highlights

This weekly newsletter curates nine insightful articles covering Google’s Guess.js toolkit, I/O 2018 web highlights, front‑end AR techniques, Chrome’s autoplay restrictions, a deep dive into Redux, WebAssembly versus JavaScript performance, comprehensive CSS line‑break methods, ten common software architecture patterns, and guidance on front‑end engineer career advancement.

CSSJavaScriptRedux
0 likes · 4 min read
Weekly Tech Newsletter Summary – Frontend Development Highlights
AutoHome Frontend
AutoHome Frontend
May 17, 2018 · Frontend Development

Master Modern Scrolling: CSS & JavaScript Techniques for Smooth, Accessible Web Experiences

This article explores the latest CSS and JavaScript features for handling page scrolling, covering scrollbar visibility tricks, custom scrollbar styling, smooth scroll APIs, sticky positioning, event throttling, viewport detection, overscroll control, and touch‑device nuances, while weighing cross‑browser support and performance trade‑offs.

accessibilityfrontendscrolling
0 likes · 17 min read
Master Modern Scrolling: CSS & JavaScript Techniques for Smooth, Accessible Web Experiences
Qunar Tech Salon
Qunar Tech Salon
May 17, 2018 · Operations

Design and Implementation of an Integrated Case and Bug Management Platform (Todolist) for Agile QA Processes

This article describes the challenges of traditional case and bug workflows in fast‑moving development, proposes automated solutions such as self‑checking test standards, checklist‑to‑case conversion, and reject‑rule enforcement, and details the architecture and user‑experience improvements of the Todolist platform integrated with Jira.

Case ManagementJira IntegrationQA
0 likes · 10 min read
Design and Implementation of an Integrated Case and Bug Management Platform (Todolist) for Agile QA Processes
Suning Technology
Suning Technology
May 14, 2018 · Frontend Development

Highlights from Suning’s 2018 Front‑End Tech Forum: Node.js, React, WebRTC & Data Viz

The Suning Front‑End Technology Forum in May 2018 gathered over 500 engineers to share insights on Node.js performance tuning, React 16's new features, WebRTC for online education, WebAssembly‑based optimization, and dashboard data‑visualization techniques, offering a comprehensive snapshot of modern front‑end advancements.

ReActWebAssemblyWebRTC
0 likes · 6 min read
Highlights from Suning’s 2018 Front‑End Tech Forum: Node.js, React, WebRTC & Data Viz
Meitu Technology
Meitu Technology
May 10, 2018 · Frontend Development

Understanding Mobile Gesture Principles and Their Front-End Implementation

The article explains the mathematical foundations and front‑end implementation of five common mobile gestures—drag, pinch, rotate, single‑finger pinch, and single‑finger rotate—using native touch events, vector calculations, and matrix transformations, and provides a lightweight library that emits incremental gesture events for easy integration.

frontendgesturematrix
0 likes · 16 min read
Understanding Mobile Gesture Principles and Their Front-End Implementation
Meitu Technology
Meitu Technology
Apr 27, 2018 · Frontend Development

Front-End Image Processing: Scaling, Cropping, and Rotation with Canvas

This article explains how to perform essential front‑end image processing with the HTML5 canvas—handling cross‑origin loading, ensuring images are fully loaded, then scaling, cropping, and rotating them while preserving aspect ratio and exporting the results as base64 strings, laying groundwork for later composition techniques.

CanvasScalingcropping
0 likes · 10 min read
Front-End Image Processing: Scaling, Cropping, and Rotation with Canvas
JD Tech
JD Tech
Apr 27, 2018 · Frontend Development

Redesigning JD.com Homepage: Architecture, Performance, and Frontend Engineering with Nerv and Athena

This article recounts the four‑month redesign of JD.com’s homepage, detailing the migration from jQuery + SeaJS to the Nerv framework, the introduction of the Athena engineering platform, performance and experience optimizations such as code splitting, lazy loading, IE8 compatibility, and the monitoring and automation practices that ensure stability and scalability.

Code SplittingPerformanceathena
0 likes · 24 min read
Redesigning JD.com Homepage: Architecture, Performance, and Frontend Engineering with Nerv and Athena
JD Tech
JD Tech
Apr 26, 2018 · Frontend Development

Using HTML5 Video Tag in Mobile Web: Attributes, Inline/Fullscreen Playback, Dynamic Source Replacement, Live Streaming, and Common Issues

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.

HTML5Vuefrontend
0 likes · 13 min read
Using HTML5 Video Tag in Mobile Web: Attributes, Inline/Fullscreen Playback, Dynamic Source Replacement, Live Streaming, and Common Issues
JD Tech
JD Tech
Apr 25, 2018 · Information Security

Security Risks of Third‑Party CSS and JavaScript in Web Development

The article explains how importing third‑party images, scripts, and especially CSS can be abused to steal data, manipulate page content, hide elements, perform keylogging, trigger unwanted requests, and ultimately compromise user security, urging developers to trust only verified resources.

CSS securityfrontendmalicious CSS
0 likes · 8 min read
Security Risks of Third‑Party CSS and JavaScript in Web Development
21CTO
21CTO
Apr 14, 2018 · Frontend Development

How to Speed Up First-Page Load: DNS, TCP, TLS and Rendering Optimizations

This article explains how to reduce the time users wait for the first screen by optimizing DNS resolution, TCP and TLS handshakes, HTTP protocols, resource loading, and rendering processes, while also covering related network and security considerations.

DNS OptimizationTCP handshakeTLS
0 likes · 19 min read
How to Speed Up First-Page Load: DNS, TCP, TLS and Rendering Optimizations
Architecture Digest
Architecture Digest
Apr 13, 2018 · Frontend Development

2018 Frontend Performance Checklist

This article presents a comprehensive 2018 frontend performance checklist that guides teams from establishing a performance culture and selecting metrics to optimizing build processes, static assets, HTTP/2, security, and monitoring, while offering quick‑win actions for immediate impact.

ChecklistMetricsOptimization
0 likes · 20 min read
2018 Frontend Performance Checklist
JD Retail Technology
JD Retail Technology
Apr 11, 2018 · Frontend Development

Converting JDreact Projects to H5: Configuration, API Integration, CSS Import, Compatibility Fixes, and State Management

This guide explains step‑by‑step how to transform a JDreact mobile project into a web‑compatible H5 application by adjusting config.js, switching to JSONP API calls, importing external CSS, handling require lifting, fixing ref and input focus issues, managing borders, passing data between pages, and using AsyncStorage for state persistence.

AsyncStorageCSS integrationH5 conversion
0 likes · 16 min read
Converting JDreact Projects to H5: Configuration, API Integration, CSS Import, Compatibility Fixes, and State Management
JD Tech
JD Tech
Apr 11, 2018 · Frontend Development

Step‑by‑Step Guide to Converting JDreact Projects to H5 and Solving Common Compatibility Issues

This article explains how to transform JDreact mobile code into standard H5 pages, covering configuration changes, backend API adaptation, external CSS integration, platform‑specific ref handling, input focus problems, number‑field behavior, radio‑group styling, data passing techniques, AsyncStorage usage, and boolean value conversion.

H5 conversionMobile WebReAct
0 likes · 16 min read
Step‑by‑Step Guide to Converting JDreact Projects to H5 and Solving Common Compatibility Issues
网易UEDC
网易UEDC
Apr 2, 2018 · Frontend Development

Mastering Web List Design Patterns for B2B Interfaces

This article summarizes practical web list design patterns for B2B products, covering basic, grid, master‑detail, comprehensive, and operation‑visible/hidden lists, and offers design recommendations to improve usability, performance, and visual appeal in complex business interfaces.

B2B UIfrontendinteraction design
0 likes · 8 min read
Mastering Web List Design Patterns for B2B Interfaces
Qunar Tech Salon
Qunar Tech Salon
Mar 28, 2018 · Frontend Development

Key New Features and Architectural Changes in React 16

This article reviews the major additions and deprecations introduced in React 16, including component array returns, portals, error boundaries, fragments, strict mode, the new context API, createRef/forwardRef, fiber architecture, and async rendering utilities, illustrated with code examples.

Context APIHooksJavaScript
0 likes · 9 min read
Key New Features and Architectural Changes in React 16
Efficient Ops
Efficient Ops
Mar 25, 2018 · Fundamentals

What Skills Does a Modern Full‑Stack Developer Really Need?

The article traces the evolution of full‑stack engineering from early 2000s tasks like Photoshop design and PHP 4 scripting to today’s extensive skill set covering operations, cloud platforms, backend services, databases, frontend frameworks, design tools, logging systems, and mobile development, and asks whether mastering this breadth is worthwhile.

Full-StackWeb Developmentbackend
0 likes · 12 min read
What Skills Does a Modern Full‑Stack Developer Really Need?
Youzan Coder
Youzan Coder
Mar 21, 2018 · Frontend Development

Why Vant 1.0 Redefines Lightweight Mobile Vue Components

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.

Mobile UIVantVue
0 likes · 6 min read
Why Vant 1.0 Redefines Lightweight Mobile Vue Components
JD Tech
JD Tech
Mar 21, 2018 · Frontend Development

Dynamic Real‑Time Data Updates and Multi‑Scenario Personalization for Mini‑Program Frontends

This article describes how front‑end engineers solved dynamic real‑time operational data updates and multi‑scenario personalization for a mini‑program by leveraging a configuration system, web‑view integration, and lightweight JSON data structures, enabling rapid feature rollout with minimal backend effort.

ConfigurationDynamic DataMini Program
0 likes · 7 min read
Dynamic Real‑Time Data Updates and Multi‑Scenario Personalization for Mini‑Program Frontends
Art of Distributed System Architecture Design
Art of Distributed System Architecture Design
Mar 20, 2018 · Mobile Development

How Long Does It Take to Develop a Mobile App? A Detailed Breakdown of Timelines and Stages

The article analyzes market data and surveys to show that developing a mobile app typically takes 3‑5 months, outlining four key development phases—research, feature definition, technical implementation, and testing—while offering practical insights for founders and developers.

backenddevelopment timelinefrontend
0 likes · 17 min read
How Long Does It Take to Develop a Mobile App? A Detailed Breakdown of Timelines and Stages
JD Retail Technology
JD Retail Technology
Mar 16, 2018 · Frontend Development

JDReact Development Guide: Project Setup, Build, Debugging, and Common Issues

This article provides a comprehensive step‑by‑step guide for developing the JD oil‑card recharge feature with JDReact, covering project background, environment configuration, branch management, building for Android and iOS, troubleshooting image loading, routing, component customization, network requests, debugging, and release procedures.

BuildProcessDebuggingJDReact
0 likes · 17 min read
JDReact Development Guide: Project Setup, Build, Debugging, and Common Issues
Meituan Technology Team
Meituan Technology Team
Mar 15, 2018 · Frontend Development

Technical Stack and Practices of Meituan-Dianping Financial Platform Frontend

Meituan‑Dianping’s financial platform unified its frontend by adopting Vue for mobile, React for desktop, TypeScript, the Vix UI library, Portm mock‑data generation, Freekite visual testing, an Enhanced Hybrid SDK, SSR pre‑rendering, and robust monitoring and security, delivering up to 80 % UI development savings and markedly higher developer productivity.

TypeScriptautomationfrontend
0 likes · 26 min read
Technical Stack and Practices of Meituan-Dianping Financial Platform Frontend
21CTO
21CTO
Mar 4, 2018 · Frontend Development

How to Keep Large SPAs Fast: 6 Proven Performance Strategies

This article explores the performance challenges of large Single Page Applications and presents six practical optimization techniques—including fast startup, route-based code splitting, shared bundle extraction, component preloading, ESM tree‑shaking, and PWA caching—to maintain a smooth user experience while keeping bundle sizes low.

Code SplittingPWASPA
0 likes · 7 min read
How to Keep Large SPAs Fast: 6 Proven Performance Strategies
21CTO
21CTO
Mar 2, 2018 · Operations

How to Architect Large-Scale Websites: From Frontend to Data Center

This article outlines the comprehensive architecture of massive websites, covering frontend optimization, application and service layers, storage solutions, backend processing, monitoring, security, and data‑center design to handle billions of users and petabytes of data.

backendfrontendwebsite architecture
0 likes · 11 min read
How to Architect Large-Scale Websites: From Frontend to Data Center
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
Feb 10, 2018 · Frontend Development

Mastering CORS: How to Fix Cross‑Origin Errors in Your Web Apps

This article explains what CORS is, why browsers enforce same‑origin policies, details the essential HTTP headers involved, and offers practical solutions—including server‑side configuration, temporary browser work‑arounds, and proxy setups—to resolve cross‑origin request errors.

AJAXCORSCross-Origin
0 likes · 7 min read
Mastering CORS: How to Fix Cross‑Origin Errors in Your Web Apps
MaGe Linux Operations
MaGe Linux Operations
Feb 8, 2018 · Frontend Development

Essential Regular Expressions for Data Validation in Development

This article compiles a comprehensive set of commonly used regular expressions for validating numbers, characters, and special data formats such as emails, URLs, phone numbers, and monetary values, providing developers with a handy reference to streamline input validation tasks.

Validationfrontendregular expressions
0 likes · 11 min read
Essential Regular Expressions for Data Validation in Development
58 Tech
58 Tech
Feb 7, 2018 · Frontend Development

ArthurCI: Accelerating Frontend Continuous Integration with Stable Infrastructure

The article introduces ArthurCI, a front‑end continuous‑integration platform developed by 58, detailing its design, performance optimizations such as yarn caching and parallel webpack compression, ease‑of‑use integration steps, stability features, and future data‑driven enhancements, while comparing it with tools like TravisCI.

CIDevOpsYARN
0 likes · 9 min read
ArthurCI: Accelerating Frontend Continuous Integration with Stable Infrastructure
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
Feb 2, 2018 · Frontend Development

Boost Web Performance with Loder: A Lightweight Frontend Loader

Loder is a lightweight, declarative web loader that optimizes resource‑task dependencies, enables ultra‑fast app startup, and provides performance tracking, helping developers overcome the limitations of traditional linear loading especially on constrained mobile devices.

JavaScriptWeb Performancefrontend
0 likes · 4 min read
Boost Web Performance with Loder: A Lightweight Frontend Loader
网易UEDC
网易UEDC
Jan 31, 2018 · Frontend Development

Why Design Standards Supercharge Efficiency: A Complete Interaction Spec Guide

This article explains how well‑crafted interaction design specifications—from early‑stage framework planning to atomic‑design methodology—dramatically improve team efficiency, product quality, and user experience, while offering practical steps for creation, iteration, and organization.

UI componentsatomic designdesign standards
0 likes · 16 min read
Why Design Standards Supercharge Efficiency: A Complete Interaction Spec Guide
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
Jan 25, 2018 · Frontend Development

Why Use Pure HTML/CSS Over JavaScript? 7 Practical Techniques

This article explains why simple HTML/CSS solutions are often preferable to JavaScript, and demonstrates seven practical techniques—including navigation highlighting, hover‑based menus, custom form controls, equal‑height columns, dynamic item layouts, form submission, and automatic Enter‑key handling—each with clean code examples.

CSSHTMLUI
0 likes · 12 min read
Why Use Pure HTML/CSS Over JavaScript? 7 Practical Techniques
Aotu Lab
Aotu Lab
Jan 23, 2018 · Frontend Development

How to Build a Popstar Match‑3 Game with MVC Architecture in JavaScript

This article explains the rules, scoring system, and level design of the classic "Popstar" match‑3 game, then details a full MVC implementation in JavaScript—including tile representation, wave‑average distribution, shuffle, wall solidification, view updates, control bindings, and a discussion of the knapsack‑style max‑score problem—while providing complete code snippets and a GitHub repository link.

AlgorithmGame DevelopmentJavaScript
0 likes · 14 min read
How to Build a Popstar Match‑3 Game with MVC Architecture in JavaScript
Alibaba Cloud Developer
Alibaba Cloud Developer
Jan 23, 2018 · Frontend Development

Where Is the Future of Front‑End Engineering Heading?

This article explores the evolving role of front‑end engineers, outlining how their work is diversifying across domains, industries and tech stacks, converging with device, full‑stack and AI technologies, while core fundamentals remain unchanged, and offers guidance on navigating the future.

AI integrationTechnology TrendsWeb Development
0 likes · 10 min read
Where Is the Future of Front‑End Engineering Heading?
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
Jan 18, 2018 · Frontend Development

How LINE Manga Achieves Native‑Like Page Transitions with a Page Stack

This article explains how LINE Manga uses a custom Page Stack architecture, inspired by iOS UINavigationController, to deliver native‑like, smooth page transitions in a web environment, addressing back‑button latency, scroll restoration, and lazy‑load image issues with practical React/React‑Router examples.

JavaScriptWeb Performancefrontend
0 likes · 5 min read
How LINE Manga Achieves Native‑Like Page Transitions with a Page Stack
Meituan Technology Team
Meituan Technology Team
Jan 18, 2018 · Backend Development

Performance Optimization Practices for Meituan's Overseas Business

The article outlines Meituan Travel’s overseas performance‑optimization strategy, detailing network enhancements such as HttpDNS, CDN nodes and long‑connection proxies, frontend tactics like CDN‑served static HTML, adaptive images and server‑side rendering, backend improvements including SSD upgrades, caching, serviceization and async I/O, and a dual‑region architecture that together boost load speed, reliability and scalability.

backendfrontendmobile
0 likes · 26 min read
Performance Optimization Practices for Meituan's Overseas Business
Taobao Frontend Technology
Taobao Frontend Technology
Jan 18, 2018 · Frontend Development

Master Rax: From Basics to Advanced Development

This comprehensive guide introduces Rax—a lightweight, cross‑container JavaScript framework from Alibaba—covers its core concepts, JSX syntax, component lifecycle, event handling, drivers, framework APIs, development tools, debugging, deployment best practices, and provides practical code examples for beginners and experienced developers alike.

JavaScriptRaxfrontend
0 likes · 14 min read
Master Rax: From Basics to Advanced Development
21CTO
21CTO
Jan 17, 2018 · Frontend Development

Why I Love JavaScript: Uncovering Its Quirks and Powerful Features

Despite its reputation for oddities and browser inconsistencies, JavaScript has evolved with ES6 features like default parameters, arrow functions, template literals, destructuring, and more, making it expressive and efficient; this article explores those quirks and explains why the author prefers JavaScript for modern development.

JavaScriptcode exampleses6
0 likes · 6 min read
Why I Love JavaScript: Uncovering Its Quirks and Powerful Features
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
Jan 16, 2018 · Frontend Development

How Bilibili Scaled Its Frontend: From MVC to Vue SSR and Koa

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.

DockerKoaNode.js
0 likes · 15 min read
How Bilibili Scaled Its Frontend: From MVC to Vue SSR and Koa
Hujiang Technology
Hujiang Technology
Jan 16, 2018 · Frontend Development

Implementing Data Binding in JavaScript: Observer, Compiler, and ViewModel

This article explains the concept, purpose, and elements of data binding in JavaScript, describes view‑to‑model and model‑to‑view binding techniques such as publish‑subscribe, data hijacking and dirty checking, and provides a complete implementation using an Observer, a Compile engine, and a ViewModel to achieve automatic UI updates when the underlying data changes.

JavaScriptMVVMObserver Pattern
0 likes · 10 min read
Implementing Data Binding in JavaScript: Observer, Compiler, and ViewModel
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
Jan 13, 2018 · Frontend Development

Master 48 Essential JavaScript Snippets in 30 Seconds

This article presents a curated collection of 48 practical JavaScript utilities—from generating anagrams and calculating averages to deep‑flattening arrays and creating UUIDs—each explained in a concise description with ready‑to‑use code examples for front‑end developers.

AlgorithmsJavaScriptcode snippets
0 likes · 16 min read
Master 48 Essential JavaScript Snippets in 30 Seconds
21CTO
21CTO
Jan 12, 2018 · Fundamentals

8 Must‑Build Projects to Supercharge Your Coding Muscles

This article presents eight hands‑on project ideas—from cloning Trello and building a user‑management dashboard to creating a native cryptocurrency tracker and a Messenger clone—designed to strengthen your coding skills across frontend, backend, and mobile development while teaching essential tools like React, Redux, Webpack, and APIs.

backendcoding practicefrontend
0 likes · 6 min read
8 Must‑Build Projects to Supercharge Your Coding Muscles
AntTech
AntTech
Jan 9, 2018 · Frontend Development

Ant Design 3.0: The Story Behind the Design System and Its Principles

The article recounts the first Ant Financial SEE Conf 2018, then details the conception, mathematical foundations, and practical implementation of Ant Design 3.0's design system—including design language, assets, typography, layout, and color—aimed at improving efficiency, consistency, and user experience for enterprise products.

TypographyUIant-design
0 likes · 22 min read
Ant Design 3.0: The Story Behind the Design System and Its Principles
21CTO
21CTO
Jan 9, 2018 · Frontend Development

How Bilibili Evolved Its Frontend: From MVC to Vue SSR and Scalable Architecture

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.

DockerNode.jsPerformance
0 likes · 15 min read
How Bilibili Evolved Its Frontend: From MVC to Vue SSR and Scalable Architecture
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
Jan 6, 2018 · Frontend Development

How to Recolor Any Image with CSS background-blend-mode (Lighten)

This tutorial demonstrates how to use CSS background-blend-mode with the lighten blend mode to recolor black‑on‑white images, explains the difference from mix-blend-mode, shows code examples, discusses limitations with transparent backgrounds, and outlines compatibility and further possibilities.

CSSbackground-blend-modecoloring
0 likes · 7 min read
How to Recolor Any Image with CSS background-blend-mode (Lighten)
JD Retail Technology
JD Retail Technology
Jan 5, 2018 · Frontend Development

Design and Architecture of the Hawaii SSR Framework for WeChat HandQ

The article introduces the Hawaii framework—a Node.js based server‑side rendering solution used by WeChat HandQ—detailing its background, core RDS request description files, component architecture, development workflow, comparison with React/Vue and GraphQL, and its deployment and monitoring strategies.

Node.jsRDSSSR
0 likes · 10 min read
Design and Architecture of the Hawaii SSR Framework for WeChat HandQ
JavaScript
JavaScript
Jan 1, 2018 · Frontend Development

Schedule a Two‑Hour Delayed Console Message with setTimeout

This concise JavaScript example demonstrates how to employ setTimeout to schedule a console.log call that prints a colored 'Good night, friends~' message after a two‑hour delay, illustrating the use of timing functions and CSS styling within console output.

JavaScriptconsole.logfrontend
0 likes · 1 min read
Schedule a Two‑Hour Delayed Console Message with setTimeout
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
Dec 30, 2017 · Frontend Development

Mastering AJAX Cross‑Domain: From CORS to JSONP and Proxy Solutions

This article thoroughly explains AJAX cross‑domain issues, covering the underlying same‑origin policy, CORS and JSONP mechanisms, common error manifestations, step‑by‑step backend configurations for PHP, Node.js, Java, .NET, and proxy techniques, plus practical debugging methods using Chrome DevTools.

Cross-OriginDebuggingJSONP
0 likes · 14 min read
Mastering AJAX Cross‑Domain: From CORS to JSONP and Proxy Solutions