BestHub
Sign in
Tagged articles

frontend

3211 articles · Page 30 of 33
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
Jul 2, 2017 · Frontend Development

Top Frontend & Tech News This Week: Webpack 3, Expo SDK 18, Node.js vs Java

The latest weekly roundup highlights key developments for front‑end engineers, including the release of Webpack 3.0, Expo SDK 18.0.0, ESLint 4.1.0, a survey naming Mark Zuckerberg the least cautious IT CEO, China Mobile’s tethered‑drone high‑altitude base station, Node.js’s ambition to surpass Java, a resurgence of ransomware attacks, Google’s Cloud Machine Learning Engine launch, and Red Hat’s acquisition of Codenvy.

ExpoWeb Developmentfrontend
0 likes · 6 min read
Top Frontend & Tech News This Week: Webpack 3, Expo SDK 18, Node.js vs Java
Aotu Lab
Aotu Lab
Jun 30, 2017 · Frontend Development

Build a Smiling Bag Loading Animation with SVG and CSS

This step‑by‑step guide shows how to combine SVG graphics and CSS animations to create a loading indicator shaped like a smiling shopping bag, covering viewport setup, path drawing, styling, keyframe animation, and motion along paths.

Loading Indicatorfrontendweb design
0 likes · 7 min read
Build a Smiling Bag Loading Animation with SVG and CSS
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
Jun 29, 2017 · Frontend Development

Master CSS: Semantic HTML, Modular Design, and Naming Conventions

This article explains how to level up your CSS skills by using proper semantic markup, modular component structures, a unified naming system like BEM, and the single‑responsibility principle, providing practical code examples and visual illustrations for robust, maintainable front‑end styling.

BEMCSSModular Design
0 likes · 9 min read
Master CSS: Semantic HTML, Modular Design, and Naming Conventions
Baidu Maps Tech Team
Baidu Maps Tech Team
Jun 29, 2017 · Frontend Development

How to Diagnose and Optimize WebGL Performance: Practical Tips and Tools

This guide explains how to identify performance bottlenecks in WebGL applications by examining CPU and GPU workloads, using tools such as stats.js, Chrome DevTools, Web Tracing Framework, and offers concrete optimization strategies for shaders, draw calls, state changes, and resource management.

Chrome DevToolsGPUGraphics
0 likes · 9 min read
How to Diagnose and Optimize WebGL Performance: Practical Tips and Tools
Architecture Digest
Architecture Digest
Jun 28, 2017 · Frontend Development

A Comprehensive Guide to Selecting Front‑End Frameworks and Libraries

This article explains the differences between libraries and frameworks, outlines common front‑end solution categories such as DOM manipulation, communication, utilities, templating, components, routing and architecture, and provides practical recommendations of popular JavaScript tools for each area.

JavaScriptLibraryTemplating
0 likes · 11 min read
A Comprehensive Guide to Selecting Front‑End Frameworks and Libraries
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
Jun 25, 2017 · Frontend Development

What’s New This Week in Front‑End Tech? AI Cloud, React 15.6, Angular 4.2, and More

This week’s front‑end roundup covers Tencent’s new “Intelligent Cloud” AI‑as‑a‑Service platform, Walmart’s ban on AWS, releases of React 15.6.0, Angular 4.2, ESLint 4.0.0, Firefox 54 and Chrome 60 Beta, plus updates on Apple Music licensing, Visual Studio 2017 preview and Owl Labs’ robotic conference camera.

AngularCloud AIDevelopment Tools
0 likes · 6 min read
What’s New This Week in Front‑End Tech? AI Cloud, React 15.6, Angular 4.2, and More
21CTO
21CTO
Jun 23, 2017 · Frontend Development

Master Front-End Error Collection: Capture JS Exceptions and Resource Failures

This guide explains why front‑end error collection is essential, outlines effective methods such as using window.addEventListener('error', true), details the types of exceptions to monitor—including script errors, resource load failures, HTML hijacking, and CSS issues—and provides practical code snippets for reporting and handling them.

JavaScriptWeb Performanceerror monitoring
0 likes · 10 min read
Master Front-End Error Collection: Capture JS Exceptions and Resource Failures
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
Jun 22, 2017 · Frontend Development

Mastering Deep vs Shallow Cloning in JavaScript and jQuery

This article explains the difference between deep and shallow cloning in JavaScript, illustrates how reference types affect object copies, demonstrates practical implementations using loops, Array.concat, and jQuery.extend, and shows visual examples to help developers avoid common pitfalls when merging objects.

Shallow Clonedeep clonefrontend
0 likes · 4 min read
Mastering Deep vs Shallow Cloning in JavaScript and jQuery
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
Jun 20, 2017 · Frontend Development

Top 10 Front‑End Career Questions Answered: Strategies, Learning Paths & Industry Insights

This article compiles ten common front‑end questions from Zhihu, offering practical advice on market demand, learning strategies, solidifying fundamentals, choosing between design and development, interview tactics, and the future outlook of web development, all backed by real‑world analogies and examples.

JavaScriptLearningWeb Development
0 likes · 39 min read
Top 10 Front‑End Career Questions Answered: Strategies, Learning Paths & Industry Insights
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
Jun 20, 2017 · Frontend Development

Master Webpack: Core Concepts, Real-World Scenarios, and Custom Extensions

An in‑depth tutorial explains webpack’s core concepts, build workflow, and practical scenarios—from single‑page apps and code splitting to npm package and server‑side rendering builds—plus guidance on creating custom loaders and plugins, empowering developers to master and extend this essential front‑end bundler.

Pluginbuild-toolsfrontend
0 likes · 13 min read
Master Webpack: Core Concepts, Real-World Scenarios, and Custom Extensions
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
Jun 20, 2017 · Frontend Development

Master JavaScript Operators: From Identifiers to Advanced Usage

This article explains JavaScript identifiers and systematically breaks down every type of operator—from unary and boolean to relational, equality, conditional, assignment, comma, and bitwise—illustrating each with clear definitions, code examples, and visual diagrams for front‑end developers.

ECMAScriptIdentifiersfrontend
0 likes · 12 min read
Master JavaScript Operators: From Identifiers to Advanced Usage
21CTO
21CTO
Jun 18, 2017 · Frontend Development

Build an Inclusive Website: Practical Accessibility Guidelines for Developers

This guide explains website accessibility, describes how people with visual, auditory, motor, and cognitive disabilities interact with the web, and provides actionable steps—semantic markup, color contrast, keyboard navigation, ARIA attributes, form and table best practices, and testing tools—to build inclusive, accessible sites.

ARIAWCAGWeb Development
0 likes · 15 min read
Build an Inclusive Website: Practical Accessibility Guidelines for Developers
Architecture Digest
Architecture Digest
Jun 18, 2017 · Frontend Development

Web Accessibility Guide for Frontend Development

This article explains website accessibility, describes how people with visual, auditory, motor, and cognitive disabilities access sites, and provides practical guidelines—including semantic structure, color contrast, ARIA roles, form and table markup, keyboard navigation, media handling, and testing tools—to help frontend developers build accessible web pages.

ARIAWCAGWeb
0 likes · 13 min read
Web Accessibility Guide for Frontend Development
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
Jun 18, 2017 · Frontend Development

This Week’s Front‑End Highlights: Apple Health Push, Safari 11, V8 6.0 & More

From Apple’s secret team turning iPhones into medical records to Safari 11’s new WebRTC and WebAssembly support, V8 6.0’s SharedArrayBuffer, Puppet Labs’ DevOps survey, WeChat’s open‑source WCDB, Tencent’s mobile analytics, StackOverflow’s HTTPS migration, and a new front‑end lifecycle model, this roundup covers the top front‑end developments of the week.

JavaScriptTechnology NewsWeb Development
0 likes · 6 min read
This Week’s Front‑End Highlights: Apple Health Push, Safari 11, V8 6.0 & More
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
Jun 15, 2017 · Frontend Development

Top 10 Front-End Interview Algorithm Questions and Solutions

This article compiles ten common algorithmic challenges frequently asked in front‑end interviews, explains why mastering data structures matters for developers, and provides concise solutions and key insights for each problem, from palindrome checks to binary search tree implementation in JavaScript.

AlgorithmJavaScriptcoding-challenge
0 likes · 8 min read
Top 10 Front-End Interview Algorithm Questions and Solutions
Baidu Waimai Technology Team
Baidu Waimai Technology Team
Jun 13, 2017 · Frontend Development

Design and Implementation of a Universal Frontend Event Tracking Solution

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.

MutationObserverVuedeclarative-tracking
0 likes · 14 min read
Design and Implementation of a Universal Frontend Event Tracking Solution
Hujiang Technology
Hujiang Technology
Jun 13, 2017 · Frontend Development

Designing Data Structures for a Visual H5 Page Editor (Web IDE)

The article explains how to design a data‑driven architecture for a visual H5 page editor, detailing the abstraction of pages, elements, and history into structured objects, and showing how front‑end developers can map complex UI interactions to clean, editable data models.

H5Visual Editordata structure
0 likes · 14 min read
Designing Data Structures for a Visual H5 Page Editor (Web IDE)
21CTO
21CTO
Jun 12, 2017 · Frontend Development

Mastering JavaScript Error Handling: From Try‑Catch to Global onerror

This article explains why proper JavaScript error handling is essential, compares syntax and runtime errors, demonstrates good and bad try‑catch patterns, shows how to use global onerror listeners, capture stack traces, and handle asynchronous exceptions to improve frontend code reliability.

AsynchronousDebuggingException
0 likes · 13 min read
Mastering JavaScript Error Handling: From Try‑Catch to Global onerror
Java High-Performance Architecture
Java High-Performance Architecture
Jun 10, 2017 · Frontend Development

Master 7 Essential ES6 Features in Just 30 Minutes

This concise guide introduces seven frequently used ES6 features—including let, const, arrow functions, default parameters, destructuring, object shorthand, and template literals—explaining each concept so you can grasp them in roughly half an hour.

Arrow FunctionsJavaScriptconst
0 likes · 1 min read
Master 7 Essential ES6 Features in Just 30 Minutes
Qunar Tech Salon
Qunar Tech Salon
Jun 7, 2017 · Frontend Development

Cross‑Origin Communication Techniques: JSONP, window.name, document.domain, CORS, postMessage, and WebSocket with Code Samples

This article demonstrates several cross‑origin communication methods—including JSONP, window.name, document.domain, CORS, postMessage, and WebSocket—by providing step‑by‑step code examples, host file configuration, and instructions for testing each technique in a local environment development.

CORSCross-OriginJSONP
0 likes · 12 min read
Cross‑Origin Communication Techniques: JSONP, window.name, document.domain, CORS, postMessage, and WebSocket with Code Samples
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
Jun 6, 2017 · Frontend Development

Boost Front‑End Efficiency with HTML Inheritance Patterns

This article explores how applying inheritance concepts to HTML structure can reduce duplicated code, simplify maintenance, and improve front‑end development efficiency by extracting common elements into a base template and using build‑time tools to generate page‑specific pages.

Web Developmentcode reusefrontend
0 likes · 6 min read
Boost Front‑End Efficiency with HTML Inheritance Patterns
Qunar Tech Salon
Qunar Tech Salon
Jun 6, 2017 · Information Security

Same‑Origin Policy and Cross‑Origin Techniques in Web Development

This article explains the fundamentals of the browser same‑origin policy, defines what constitutes an origin, describes the restrictions it imposes, and surveys practical cross‑origin solutions such as dynamic tags, JSONP, CORS, postMessage, document.domain, window.name, fetch, and WebSocket.

CORSCross-Originfrontend
0 likes · 15 min read
Same‑Origin Policy and Cross‑Origin Techniques in Web Development
Tongcheng Travel Technology Center
Tongcheng Travel Technology Center
Jun 2, 2017 · Frontend Development

Understanding Shadow DOM: Concepts, Usage, and Comparison with Virtual DOM

This article introduces the fundamentals of Shadow DOM, explains its core concepts, usage patterns, key features, and API, compares it with Virtual DOM, demonstrates practical code examples for creating and styling shadow roots, handling slots and events, and discusses browser support and related tooling.

CSS ScopingJavaScriptShadow DOM
0 likes · 9 min read
Understanding Shadow DOM: Concepts, Usage, and Comparison with Virtual DOM
Qunar Tech Salon
Qunar Tech Salon
Jun 2, 2017 · Frontend Development

A Review of Frontend Moduleization Development and Tooling

This article reviews the evolution of frontend moduleization over the past decade, discusses the problems of early script inclusion, presents various solutions such as namespaces, closures, CommonJS, ES6 modules, and modern build tools, and illustrates each approach with concrete JavaScript code examples.

CommonJSJavaScriptbuild-tools
0 likes · 16 min read
A Review of Frontend Moduleization Development and Tooling
Node Underground
Node Underground
Jun 1, 2017 · Frontend Development

Why HTTP/2 Server Push Isn’t a Silver Bullet and How to Use It Effectively

HTTP/2 introduced server push to let servers proactively send resources, but it suffers from issues such as cache invalidation after connection closure, difficulty identifying needed pages, lack of authentication reuse, and other pitfalls, so understanding its traps and best practices is essential for effective use.

HTTP/2Server PushWeb Performance
0 likes · 2 min read
Why HTTP/2 Server Push Isn’t a Silver Bullet and How to Use It Effectively
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
May 25, 2017 · Frontend Development

How Front-End Developers Can Avoid Endless Revisions and Boost Product Thinking

This article explores how front‑end developers can break the cycle of endless revisions by adopting the right mindset, collaborating effectively with product and design teams, embracing component‑based thinking, and developing product‑centric skills that improve efficiency and quality throughout the development process.

ComponentizationProduct Thinkingdevelopment workflow
0 likes · 7 min read
How Front-End Developers Can Avoid Endless Revisions and Boost Product Thinking
MaGe Linux Operations
MaGe Linux Operations
May 25, 2017 · Frontend Development

Top 56 Data Visualization Tools Every Developer Should Know

This article provides a comprehensive overview of 56 data visualization tools ranging from simple spreadsheet options to advanced JavaScript libraries, mapping frameworks, and statistical packages, helping developers choose the right solution for creating interactive and insightful visual representations of their data.

JavaScriptchartsdata visualization
0 likes · 18 min read
Top 56 Data Visualization Tools Every Developer Should Know
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
May 23, 2017 · Frontend Development

Must‑Know Front‑End Developer Tips: Tools, Testing, and Workflow Hacks

This article compiles practical advice from two seasoned engineers—Rebecca Murphey and Philip Walton—covering essential front‑end tools, module usage, testing, build automation, Git strategies, server‑side rendering, Node.js mastery, deep code understanding, browser spec vigilance, code reviews, teamwork, and the value of documenting learning.

Git workflowModule Bundlingbest practices
0 likes · 8 min read
Must‑Know Front‑End Developer Tips: Tools, Testing, and Workflow Hacks
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
May 21, 2017 · Frontend Development

How HTML and CSS Attribute Order Impacts Gzip Compression Size

This article explores how the ordering of HTML and CSS attributes influences gzip compression ratios, demonstrates size differences with reordered code, and clarifies Chrome DevTools' Size vs. Content values, offering practical tips for better web performance and maintainable code.

compressionfrontendgzip
0 likes · 5 min read
How HTML and CSS Attribute Order Impacts Gzip Compression Size
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
May 18, 2017 · Frontend Development

Unveiling jQuery’s Object Architecture: How $ and init Work

This article explores how jQuery constructs its $ objects by wrapping a simplified implementation, detailing prototype assignments, the init function, extension mechanisms, and best practices, while providing code snippets and diagrams to help developers deepen their understanding of JavaScript and frontend development.

frontendjQueryobject encapsulation
0 likes · 10 min read
Unveiling jQuery’s Object Architecture: How $ and init Work
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
May 16, 2017 · Frontend Development

How Ele.me Built a ‘Big Front‑End’ Team: Structure, Culture, and Tech Choices

Ele.me’s ‘big front‑end’ team, led by Lin Jianfeng, explains why the team was created, its evolving responsibilities spanning web, Node, and native apps, the culture of autonomous ‘scatter‑raised’ management, technology adoption strategies, and the pros and cons of this organizational model.

Big Front-EndSoftware Architecturefrontend
0 likes · 16 min read
How Ele.me Built a ‘Big Front‑End’ Team: Structure, Culture, and Tech Choices
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
May 16, 2017 · Frontend Development

Master Drag-and-Drop in JavaScript: Three Ways to Build a Reusable Drag Object

This article walks you through three approaches to implement drag-and-drop in JavaScript—plain code, a native object wrapper, and a jQuery extension—covering essential concepts like transform compatibility, event handling, position calculations, and object-oriented encapsulation, with detailed code examples and visual diagrams.

DOMDrag-and-DropObject-Oriented
0 likes · 12 min read
Master Drag-and-Drop in JavaScript: Three Ways to Build a Reusable Drag Object
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
May 14, 2017 · Information Security

Mastering XSS: A Complete Guide to Understanding and Preventing Cross‑Site Scripting

This comprehensive tutorial explains what XSS is, describes the three main attack types, illustrates how malicious scripts are injected and executed, and provides practical strategies—including encoding, validation, and Content Security Policy—to defend web applications against cross‑site scripting vulnerabilities.

Content Security PolicyCross-site scriptingInput Validation
0 likes · 28 min read
Mastering XSS: A Complete Guide to Understanding and Preventing Cross‑Site Scripting
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
May 14, 2017 · Frontend Development

This Week’s Top Tech Headlines: Ransomware, Linux on Windows, AI Moves

A weekly roundup covers the surge of ONION ransomware on Chinese campuses, Microsoft's addition of Linux distros to the Windows Store, major AI and AR investments, open‑source JavaScript optimization, IBM's API microgateway, shifting web‑server market shares, data's rising value, Google's Cloud Speech launch, and Android's Project Treble to curb fragmentation.

AILinuxRansomware
0 likes · 8 min read
This Week’s Top Tech Headlines: Ransomware, Linux on Windows, AI Moves
ITPUB
ITPUB
May 11, 2017 · Frontend Development

Mastering JavaScript Console: Advanced Logging, Grouping, and Performance Tools

This article provides a comprehensive guide to JavaScript's console API, covering basic logging methods, object inspection, grouping, clearing, performance timing, profiling, tracing, assertions, and counting, with practical code examples and tips for effective debugging in development environments.

JavaScriptPerformanceconsole
0 likes · 8 min read
Mastering JavaScript Console: Advanced Logging, Grouping, and Performance Tools
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
May 11, 2017 · Frontend Development

From Rookie to Front‑End Leader: Lessons from 9 Years at Alibaba

The author recounts his nine‑year journey at Alibaba, detailing four career stages, the evolution of front‑end architecture for B‑class e‑commerce, internationalization challenges, team‑management insights, and practical advice for front‑end engineers seeking growth and resilience.

architecturefrontendinternationalization
0 likes · 18 min read
From Rookie to Front‑End Leader: Lessons from 9 Years at Alibaba
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
May 9, 2017 · Frontend Development

Master JavaScript Functions: Declarations, Expressions, IIFEs, and More

This article explores every essential aspect of JavaScript functions—from declarations, expressions, anonymous callbacks, and self‑executing IIFEs to parameter passing, functional programming concepts, closures, and advanced module patterns—providing clear explanations, diagrams, and code examples to help developers build solid foundations.

IIFEclosuresfrontend
0 likes · 14 min read
Master JavaScript Functions: Declarations, Expressions, IIFEs, and More
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
May 9, 2017 · Frontend Development

From spm to Ant Tool: Evolution of Alibaba’s Front‑End Build System

This article traces the history of Alipay’s front‑end build ecosystem—from the early spm package manager through the all‑in‑one spm3 era, the rise of ant tool, and the shift toward modular presets—highlighting the challenges of centralisation, configuration complexity, and future directions.

Modularizationant-toolbuild-tools
0 likes · 23 min read
From spm to Ant Tool: Evolution of Alibaba’s Front‑End Build System
Hujiang Technology
Hujiang Technology
May 9, 2017 · Frontend Development

Getting to Know CSS Grid Layout – A Comprehensive Guide

This article introduces CSS Grid Layout, covering its core concepts, browser support, practical examples for creating columns, gutters, fractional units, alignment, legacy support, padding, rows, flexible sizing with minmax, and advanced techniques like auto‑fit and auto‑fill to build responsive, media‑query‑free layouts.

CSS GridLayoutfrontend
0 likes · 13 min read
Getting to Know CSS Grid Layout – A Comprehensive Guide
System Architect Go
System Architect Go
May 8, 2017 · Frontend Development

Recap of Ele.me Frontend Technology Conference: PWA, Collaboration, Dependency Monitoring, Vue, Flow, and More

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.

Ele.meFlowPWA
0 likes · 6 min read
Recap of Ele.me Frontend Technology Conference: PWA, Collaboration, Dependency Monitoring, Vue, Flow, and More
Baidu Maps Tech Team
Baidu Maps Tech Team
May 5, 2017 · Frontend Development

Designing a High‑Performance WebGL Map Engine: Architecture & Rendering Core

This article explores the architecture of a WebGL‑based map engine, detailing its core rendering pipeline, essential modules such as data handling, shader management, buffers, and event‑driven rendering loops, while highlighting performance considerations and best practices for efficient, on‑demand map visualization.

RenderingWebGLfrontend
0 likes · 7 min read
Designing a High‑Performance WebGL Map Engine: Architecture & Rendering Core
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
May 4, 2017 · Frontend Development

Top 16 Front-End Interview Questions and Answers Explained

This article provides concise explanations for sixteen common front‑end interview topics, covering inline vs. block elements, clearing floats, box‑sizing, CSS imports, progressive enhancement vs. graceful degradation, margin collapse, preprocessors, positioning, display types, centering techniques, CSS specificity, new CSS3 selectors and features, Flexbox, browser compatibility hacks, and media queries.

CSSLayoutResponsive
0 likes · 16 min read
Top 16 Front-End Interview Questions and Answers Explained
ITPUB
ITPUB
Apr 28, 2017 · Frontend Development

How That Crazy JS One‑Liner Turns Into “sb”: A Deep Dive into Type Coercion

This article explains why a seemingly nonsensical JavaScript expression evaluates to the two characters “sb” by dissecting its operator precedence, breaking it into sub‑expressions, and applying JavaScript’s type‑conversion rules step by step.

JavaScriptObfuscated CodeOperator Precedence
0 likes · 8 min read
How That Crazy JS One‑Liner Turns Into “sb”: A Deep Dive into Type Coercion
Tongcheng Travel Technology Center
Tongcheng Travel Technology Center
Apr 27, 2017 · Mobile Development

Evolution of Our Hybrid Technology Architecture for Mobile Applications

This article chronicles the development of our hybrid mobile technology from its 2014 inception, detailing the architectural decisions, bridgeJS integration, multi‑platform "N‑in‑1" strategy, tooling choices, performance optimizations, and future directions for efficient cross‑platform mobile app delivery.

BridgeJSarchitecturecross-platform
0 likes · 8 min read
Evolution of Our Hybrid Technology Architecture for Mobile Applications
Baidu Waimai Technology Team
Baidu Waimai Technology Team
Apr 26, 2017 · Fundamentals

Baidu Waimai Technical Monthly Issue 7 – Operations Monitoring, Big Data Platform, BFT Algorithm, Zombie Process, Nginx+Lua Overload Protection, OLTP/OLAP, User Repurchase Prediction, Frontend Tracking, and Favicon

The seventh issue of Baidu Waimai's technical monthly presents a collection of practical engineering articles covering operations monitoring, big‑data platform incubation, BFT crawling algorithm, zombie‑process avoidance, Nginx+Lua overload protection, OLTP/OLAP integration, new‑user repurchase prediction, a generic frontend tracking solution, and the use of favicons to personalize websites.

AIAlgorithmbackend
0 likes · 6 min read
Baidu Waimai Technical Monthly Issue 7 – Operations Monitoring, Big Data Platform, BFT Algorithm, Zombie Process, Nginx+Lua Overload Protection, OLTP/OLAP, User Repurchase Prediction, Frontend Tracking, and Favicon
Baidu Maps Tech Team
Baidu Maps Tech Team
Apr 20, 2017 · Frontend Development

Boost Map Rendering Performance with Web Workers: A Practical Guide

This article explains how Web Workers can off‑load heavy data processing in WebGL‑based map engines, covering worker creation, data serialization, transferable objects, optimal worker count, and real‑world performance gains, all illustrated with code snippets and diagrams.

JavaScriptWeb WorkerWebGL
0 likes · 9 min read
Boost Map Rendering Performance with Web Workers: A Practical Guide
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
Apr 16, 2017 · Frontend Development

Build a Simple JavaScript Calculator in Under 15 Minutes

This tutorial walks beginners through creating a basic JavaScript calculator with addition, subtraction, multiplication, division, clear (AC), and delete (DEL) functions, explaining the HTML structure, CSS styling, and step‑by‑step JavaScript logic to implement the three core parts of the app.

CSSCalculatorHTML
0 likes · 7 min read
Build a Simple JavaScript Calculator in Under 15 Minutes
Aotu Lab
Aotu Lab
Apr 14, 2017 · Frontend Development

How to Create a Sticky Footer That Stays at the Bottom on Any Page

This article explains the sticky‑footer problem when page content is short, defines the sticky‑footer effect, and provides four CSS‑based solutions—absolute positioning, calc(), table layout, and Flexbox—detailing their code, advantages, and drawbacks for responsive web design.

FlexboxSticky FooterWeb Layout
0 likes · 6 min read
How to Create a Sticky Footer That Stays at the Bottom on Any Page
Aotu Lab
Aotu Lab
Apr 14, 2017 · Frontend Development

Boost Web Performance: GPU Acceleration and Chrome DevTools Explained

This article explains how GPU acceleration can keep web pages within the 16 ms frame budget, details the browser rendering pipeline, shows how to use Chrome DevTools to inspect composited layers, and outlines practical steps and pitfalls for enabling GPU‑accelerated animations.

Chrome DevToolsCompositingGPU
0 likes · 8 min read
Boost Web Performance: GPU Acceleration and Chrome DevTools Explained
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
Apr 13, 2017 · Frontend Development

Top 10 Must‑Know ES6 Features That Transform Frontend Development

This article provides a concise overview of the ten most impactful ES6 features—including default parameters, template literals, multi‑line strings, destructuring, enhanced object literals, arrow functions, promises, block‑scoped let/const, classes, and modules—explaining their syntax, benefits, and practical usage for modern JavaScript development.

ES6 FeaturesJavaScriptModern JavaScript
0 likes · 14 min read
Top 10 Must‑Know ES6 Features That Transform Frontend Development
Hujiang Design Center
Hujiang Design Center
Apr 13, 2017 · Frontend Development

How to Use Video Effectively in Web and Mobile Design

This article outlines practical guidelines for incorporating video into web and mobile interfaces, emphasizing the need for textual alternatives, automatic mute, concise content, strong first impressions, user control, accessibility, and clear calls to action after playback.

accessibilityfrontendmedia best practices
0 likes · 6 min read
How to Use Video Effectively in Web and Mobile Design
Suning Design
Suning Design
Apr 12, 2017 · Frontend Development

5 Essential Front‑End Practices Every Visual Designer Must Master

The article outlines five crucial steps for visual designers to collaborate effectively with front‑end engineers, covering environment familiarity, design system creation, proper asset slicing, clear annotation, and pixel‑perfect testing to ensure seamless implementation and reduce miscommunication.

Design Guidelinescommunicationdesign workflow
0 likes · 7 min read
5 Essential Front‑End Practices Every Visual Designer Must Master
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
Apr 9, 2017 · Frontend Development

Boost Mini Program Development with Essential ES6 Features

This article explains how key ES6 features—arrow functions, array methods, destructuring, enhanced object literals, classes, and block‑scoped variables—can streamline WeChat Mini Program development, improve code readability, and increase development efficiency.

Arrow FunctionsClassesJavaScript
0 likes · 8 min read
Boost Mini Program Development with Essential ES6 Features
Tongcheng Travel Technology Center
Tongcheng Travel Technology Center
Mar 29, 2017 · Frontend Development

Recap of Frontend Technology Salon Session 1: ES6, Webpack, and Asynchronous Programming

The article recaps the first Frontend Technology Salon, covering ES6 fundamentals, Webpack packaging, and practical ES6 asynchronous programming examples, offering detailed explanations and code demonstrations for frontend developers and highlights common pitfalls and browser compatibility issues.

Asynchronous ProgrammingJavaScriptes6
0 likes · 5 min read
Recap of Frontend Technology Salon Session 1: ES6, Webpack, and Asynchronous Programming
Architecture Digest
Architecture Digest
Mar 29, 2017 · Frontend Development

Front‑End Optimization Best Practices

This article presents a comprehensive guide to front‑end performance optimization, covering reduction of HTTP requests, proper handling of repaint/reflow, minimizing DOM operations, using JSON, efficient HTML/CSS, CDN acceleration, external resource loading, minification, image compression, and cookie management.

CSSJavaScriptOptimization
0 likes · 13 min read
Front‑End Optimization Best Practices
Qunar Tech Salon
Qunar Tech Salon
Mar 27, 2017 · Frontend Development

Isomorphic MVC (IMVC): A Unified Front‑End Architecture for Server‑Side and Client‑Side Rendering

The article introduces the concept of isomorphic JavaScript, explains its types and hierarchical levels, outlines its practical benefits such as SEO and faster first‑load experience, and details the IMVC framework and the create‑app library that enable seamless server‑client code sharing with a clear controller‑model‑view separation.

IsomorphicMVCNode.js
0 likes · 22 min read
Isomorphic MVC (IMVC): A Unified Front‑End Architecture for Server‑Side and Client‑Side Rendering
21CTO
21CTO
Mar 26, 2017 · Fundamentals

What Skills Should Developers Master in 2017? Complete Roadmap

Based on StackOverflow’s 2017 survey, this article visualizes major tech ecosystems—JavaScript‑centric web development, Microsoft‑based stacks, and cross‑platform Java/Android/iOS clusters—then breaks down detailed learning roadmaps for front‑end, back‑end, and operations engineers, helping developers choose their focus.

Learning Pathbackenddeveloper roadmap
0 likes · 3 min read
What Skills Should Developers Master in 2017? Complete Roadmap
Meituan Technology Team
Meituan Technology Team
Mar 24, 2017 · Frontend Development

doT.js Template Engine: Source Code Analysis and Performance Optimization

The article analyzes doT.js, a compact 6 KB, dependency‑free JavaScript template engine that builds rendering functions via regex‑based code generation, avoids the costly with statement, caches compiled templates, and delivers superior performance in benchmarks compared with jQuery‑tmpl and other minimal engines, while noting its less intuitive syntax for complex conditionals.

JavaScriptdoT.jsfrontend
0 likes · 14 min read
doT.js Template Engine: Source Code Analysis and Performance Optimization
Architecture Digest
Architecture Digest
Mar 23, 2017 · Frontend Development

Developer Roadmap: Frontend, Backend, and DevOps Learning Paths

This article presents curated learning roadmaps for aspiring frontend developers, backend developers, and DevOps engineers, originally compiled by Kamran Ahmed on GitHub, and invites readers to explore the skill sets, preferred technologies, and visual guides to advance their careers.

Roadmapbackendfrontend
0 likes · 3 min read
Developer Roadmap: Frontend, Backend, and DevOps Learning Paths
网易UEDC
网易UEDC
Mar 22, 2017 · Frontend Development

Mastering Overlay Layers: Dialogs, Toasts, and Snackbars Explained

This article defines overlay layers, compares dialog boxes, toasts, and snackbars, outlines their modal and non‑modal variants, usage scenarios, design tips, advantages, and drawbacks, helping designers choose the right temporary UI component for mobile and web applications.

DialogOverlayfrontend
0 likes · 10 min read
Mastering Overlay Layers: Dialogs, Toasts, and Snackbars Explained
System Architect Go
System Architect Go
Mar 21, 2017 · Cloud Computing

Deploy API Documentation with GitHub Pages: A Step‑by‑Step Guide

This article explains how to automatically generate API documentation using apidoc, host the resulting static files on GitHub Pages, configure the repository settings to serve the docs folder, and obtain a public URL that front‑end developers can access without manual file transfers.

API documentationGitHub Pagesapidoc
0 likes · 4 min read
Deploy API Documentation with GitHub Pages: A Step‑by‑Step Guide
Architecture Digest
Architecture Digest
Mar 21, 2017 · Frontend Development

Design and Refactoring of a Multimedia Editing Module

This article shares the architectural design insights and componentization strategy for a multimedia editing module, covering UI panel design, gesture engine decoupling, component–view interaction, and data handling while omitting proprietary code and confidential details.

Component Architecturefrontendgesture engine
0 likes · 7 min read
Design and Refactoring of a Multimedia Editing Module
21CTO
21CTO
Mar 20, 2017 · Frontend Development

How to Speed Up Page Load Times: Practical Front‑End Optimization Techniques

This article explains why page‑load speed matters, shows how to measure ready and load times, and provides concrete front‑end strategies—including reducing render‑blocking scripts and CSS, using responsive and lazy‑loaded images, applying gzip compression, cache‑control, ETag headers, DNS prefetching, and code‑level tweaks—to dramatically improve user experience and reduce bandwidth usage.

OptimizationPerformancecaching
0 likes · 23 min read
How to Speed Up Page Load Times: Practical Front‑End Optimization Techniques
ITPUB
ITPUB
Mar 18, 2017 · Frontend Development

From NodeJS Backend to Large-Scale React Native: Our ‘Big Wireless’ Team Reorg Explained

The article recounts a recent team restructuring that shifted NodeJS from pure backend development to a broader "big wireless" strategy, introduced large‑scale React Native adoption, created a dedicated architecture group, and shares practical lessons on aligning technology choices with business value.

architecturebackendfrontend
0 likes · 16 min read
From NodeJS Backend to Large-Scale React Native: Our ‘Big Wireless’ Team Reorg Explained
Baidu Waimai Technology Team
Baidu Waimai Technology Team
Mar 16, 2017 · Frontend Development

Evolution of Componentization in the Operations Backend Platform: From FIS to React and the Third‑Generation Solution

This article outlines the rapid growth of Baidu Takeaway's operations backend, analyzes the limitations of the FIS‑based modular approach, describes the transition to React‑Redux componentization, and presents a third‑generation, model‑driven component sharing platform designed to reduce repetitive development and improve developer happiness.

ComponentizationReActUI
0 likes · 12 min read
Evolution of Componentization in the Operations Backend Platform: From FIS to React and the Third‑Generation Solution
ITFLY8 Architecture Home
ITFLY8 Architecture Home
Mar 7, 2017 · Frontend Development

Boosting Taobao Home Page Speed: Front‑End Strategies for Personalization

Taobao’s redesigned home page faces heavy personalization demands, multiple data sources, and numerous modules, prompting a series of front‑end performance techniques—including prioritized loading, lazy execution, image compression, caching, and request consolidation—to improve FPS, DOMContentLoaded, and overall user experience.

PerformanceTaobaocaching
0 likes · 20 min read
Boosting Taobao Home Page Speed: Front‑End Strategies for Personalization
ITFLY8 Architecture Home
ITFLY8 Architecture Home
Mar 5, 2017 · Frontend Development

Master JavaScript Functions: From Basics to Advanced Patterns

This article provides a comprehensive guide to JavaScript functions, covering basic definitions, anonymous functions, default parameters, the arguments object, IIFE, nested functions, constructor functions, and best practices for using the new keyword, all illustrated with clear code examples.

Anonymous FunctionsDefault ParametersIIFE
0 likes · 13 min read
Master JavaScript Functions: From Basics to Advanced Patterns
Tencent TDS Service
Tencent TDS Service
Mar 2, 2017 · Frontend Development

Mastering WebSocket: From API Basics to Advanced Protocol Insights

This article provides a comprehensive overview of WebSocket, covering its origins as a full‑duplex HTML5 protocol, core JavaScript API usage, sub‑protocol negotiation, framing rules, security considerations, performance comparisons with XHR and SSE, deployment challenges, and related extensions such as Socket.IO.

PerformanceReal‑time communicationfrontend
0 likes · 34 min read
Mastering WebSocket: From API Basics to Advanced Protocol Insights
Efficient Ops
Efficient Ops
Feb 28, 2017 · Frontend Development

Boost Browser Data Handling: RxJS-Wrapped Fetch API for Smart Caching & Updates

This article examines the limitations of plain Fetch API for caching and real‑time updates in complex web apps, then demonstrates how wrapping Fetch with RxJS creates lazy‑loaded caches, reactive update notifications, and extensible data streams, while outlining practical implementation details and best practices.

Fetch APIWeb Developmentcaching
0 likes · 5 min read
Boost Browser Data Handling: RxJS-Wrapped Fetch API for Smart Caching & Updates
Hujiang Technology
Hujiang Technology
Feb 23, 2017 · Frontend Development

Understanding CSS Timing Functions: cubic-bezier() and steps()

This article explains CSS timing functions, covering the theory behind transition‑timing‑function and animation‑timing‑function, the role of Bézier curves, how to craft custom cubic‑bezier() values—including out‑of‑range curves for bounce effects—and the use of steps() for discrete animations, with browser support tables and practical examples.

animationcubic-bezierfrontend
0 likes · 20 min read
Understanding CSS Timing Functions: cubic-bezier() and steps()
21CTO
21CTO
Feb 18, 2017 · Frontend Development

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

This article examines common misconceptions and pitfalls of front‑end/back‑end separation, explains why proper preparation and clear API design are essential, and outlines practical steps—from project planning to testing and deployment—to implement a successful separation strategy in modern web development.

APIWeb Developmentarchitecture
0 likes · 6 min read
Why Front‑End/Back‑End Separation Fails and How to Do It Right
Aotu Lab
Aotu Lab
Feb 17, 2017 · Frontend Development

Master Snap.svg: From Basics to Advanced SVG Animations with Code Samples

This article provides a comprehensive guide to Snap.svg, explaining its purpose, API similarities with jQuery, core classes like Element and Paper, various animation techniques—including element and static animations, path and matrix transformations—along with compatibility tips, performance recommendations, and useful code examples.

JavaScriptMatrix transformSVG animation
0 likes · 17 min read
Master Snap.svg: From Basics to Advanced SVG Animations with Code Samples
Architecture Digest
Architecture Digest
Feb 14, 2017 · Frontend Development

Comprehensive Guide to Frontend Optimization: Efficiency, Performance, Stability, Responsiveness, Compatibility, SEO, and Accessibility

This article provides an extensive overview of frontend optimization techniques, covering work efficiency, speed performance, stability, responsive design, cross-browser compatibility, SEO best practices, and accessibility measures, offering practical tools, workflows, and strategies to improve web development productivity and user experience.

OptimizationPerformanceSEO
0 likes · 27 min read
Comprehensive Guide to Frontend Optimization: Efficiency, Performance, Stability, Responsiveness, Compatibility, SEO, and Accessibility
JavaScript
JavaScript
Feb 8, 2017 · Frontend Development

Master CSS Positioning: From Static to Sticky Explained

Learn how the CSS position property controls element layout, covering static, relative, absolute, fixed, and the modern sticky positioning, their behaviors, usage rules, and browser support, so you can apply the right positioning technique for smooth scrolling effects across browsers.

CSSPositionfrontend
0 likes · 4 min read
Master CSS Positioning: From Static to Sticky Explained
Qunar Tech Salon
Qunar Tech Salon
Feb 6, 2017 · Frontend Development

Front‑End Performance Optimization: Best Practices and Techniques

This article presents a comprehensive guide to front‑end performance optimization, covering how to prioritize bottlenecks, use debounce/throttle, reduce DOM reflows, optimize rendering, leverage requestAnimationFrame and Web Workers, and apply efficient CSS and script loading strategies, all illustrated with practical code examples.

CSSDOMJavaScript
0 likes · 16 min read
Front‑End Performance Optimization: Best Practices and Techniques
21CTO
21CTO
Jan 25, 2017 · Frontend Development

How to Open Native Apps from H5 Pages: Schemes, Smart Banners & Universal Links

This article explains practical techniques for detecting app installation and launching native iOS or Android apps from H5 pages using custom URL schemes, Smart App Banners, hidden iframes with timeout, and Universal Links, while handling special cases like WeChat.

Universal Linksapp linkingcustom scheme
0 likes · 10 min read
How to Open Native Apps from H5 Pages: Schemes, Smart Banners & Universal Links
Hujiang Technology
Hujiang Technology
Jan 23, 2017 · Frontend Development

A Beginner’s Guide to Front‑End Development in 2017

This article offers newcomers a comprehensive overview of modern front‑end development, covering project engineering, career prospects, essential tools, emerging frameworks, and the skills and technologies you should master to succeed in the evolving web ecosystem.

FrameworksProject Engineeringfrontend
0 likes · 16 min read
A Beginner’s Guide to Front‑End Development in 2017