Instructor: Issam Elbaytam, grape City Group global chief architect (Chief Software Architect
of GrapeCity Global). Data Dynamics.Inc founder and former senior product manager, personal research interests are mainly MS.NET language and platform, dynamic system construction, and high-performance large-scale distributed Web system architecture, the dominant grape variety of the city's best-selling product controls system architecture and performance optimization.
"For 25 years only four hours of rest a day, in addition to the daily schedule, Issam not research technologies and products, it is the way to the study of technology trends in the" Grape City colleagues this is consistent with his evaluation.
Why is he so obsessed with front-end development technologies? In his eyes, front-end development in the future will be going? The face of today's hot new technology HTML5, JavaScript, and the block chain, and what he different views and perspectives? What he advocated using front-end development technology, "Online Excel" shortcut system is? This issue grapes open class city, we take a closer look.
- Watch Address: https://live.vhall.com/347833693
- Live Time: 2019-11-20 (Wednesday) at 14:00 pm
- Live outline:
- Processing performance Web form controls, and what factors related?
- How SpreadJS technical architecture and design?
- Compatible with more than 450 kinds of Excel formulas, how SpreadJS do it?
- Front-end development technology advances, the future will be going?
Lesson Summary
This issue open class, Issam How will enterprise information systems through advanced technology and front-end development tools, embedded class module in the browser or Excel Web applications quickly realize the data reporting, online documents, like Excel UI design business scene and describes in detail SpreadJS of HTML5 Canvas interface drawing mode and sparse arrays (sparse array) model.
At the same time, but also to our in-depth interpretation of "the face of changing business requirements, developers how to maintain and continue to improve the speed of Web application development iterations."
Finally, as a technology enthusiast, Issam will express its views on the hottest trends in today's front-end technology.
Here is the core issue of the open class, the more wonderful to share, please click here to watch.
Enterprise Web applications, the importance of "Excel" in
Excel loved by the users as a spreadsheet tool, with its intuitive interface, excellent performance computing, data analysis and charts, has become one of the indispensable field of statistics software. Excel For businesses:
- "Speak with data in Excel" is the enterprise toward automation, information technology is the first step
- Excel is simple to operate, but hide the tremendous power and flexibility
- Many Web applications are from a "spreadsheet" began
- Perhaps incredible, Excel script is indeed one of the most popular features (of) language
- Excel functions and formulas everywhere
- Complete Turing machine system
- Excel can even draw and making a game (goof necessary)
However, the real value of enterprise software itself is Excel do?
Excel for enterprise applications short board:
- Excel chaos and inefficient management
- Dependent on the completion of Excel data exchange, will significantly reduce the operating efficiency of the application system
- Excel files and applications connected enterprises have difficulties
- Save the file using Excel simple, versatile
- But the data vulnerable to tampering
- Excel is ideal for file-based analysis
- But at the same time difficult to integrate, analyze and summarize multiple files
In the enterprise application project, highly similar to Excel, but Excel does not depend on the sort of data achieved, filtering, subtotals and other functions, is the business really need is the information system is also essential to the function module. such as:
- LoB applications
- Reduce security risks and prevent sensitive data from a temporary copy
- Applications in access control list
- Centralized database storage, and it can be used for more in-depth analysis and reporting
Thus, for enterprise applications, if there is a development tool able to overcome the shortcomings of Excel, the Excel functions, embedded Web system, the realization of Excel Web component development, data reporting, online documents, charts linkage formula, like Excel UI design business scenarios and is fully compatible with Excel formulas and document type, will undoubtedly bring great value to the enterprise .
These, however, is one of the basic functions of pure front-end of the table control SpreadJS.
Web Form Controls - SpreadJS Birth
SpreadJS birth that is unexpected, but also reasonable.
Since China fully functional access to the Internet in 1996, expectations for Web products become more ardent. Today, Web developers not only to face the pressure from the PC side unilaterally, received more mobile side, PWA (applets), and other app hybird demand platform has become commonplace.
Forced to changing business pressures, led to the development needs and improve the speed of Web application development iterations, to the greatest extent shorten project lead times, but also need to keep the ease of use and stability.
There are challenges, opportunities will exist.
American named Issam Elbaytam engineers found during development: most users in data processing, when the statistics, more accustomed to using Excel to do. However, for enterprise Web projects, Excel is also very obvious shortcomings, such as: existing applications and enterprise connection difficulties, not completely out of the Office suite, the high price of authorized, can not modify distributed data.
Upon learning of these shortcomings, a great idea was born: If you develop a pure JavaScript functions and UI are highly similar to the Excel spreadsheet control for developers to use, so that both applications meet the current popular B / S architecture requirements, the application allows users to further migration of B / S side, it can also be completely divorced from the Office suite to use.
However, to achieve such a pure class Excel front-end development tool in the end how hard? In addition to putting in a lot of R & D costs and time, the city even as grape generally has accumulated many years of company experience in the development of .NET controls, in-depth study had no front-end data rendering, integrated framework, in the case before and after the end of the Excel data interaction logic, had plenty of manpower and resources can not succeed. Among other things, just use JavaScript to achieve huge number of Excel formulas and functions, it is sufficient to consume multiple energy. . .
Grape City Spread.NET form controls
For other people might have given up, but Issam no. 20 consecutive years, in the case of a break of 4 hours a day, Issam basis Grape City Spread.NET based form controls, and finally in 2015, developed out of a real pure front-end spreadsheet control - SpreadJS .
SpreadJS interact with Excel data structure
Efforts, will win the harvest. Just five years, SpreadJS has been for a number of well-known domestic and foreign enterprises and institutions energized, help as Tianhong Fund, Huawei, China Ping An, China Merchants Bank and other industry giants, to achieve the Web Excel component development, data reporting, online documentation, graph formula linkage, data visualization core business scenarios. "Simply more than a hundred lines of code with Excel SpreadJS class operating practices, so that our users like to use Excel as the use of internal systems, and user migration after the development is completed save a lot of training time for our system, SpreadJS excellent performance let's sit back and relax. "Huawei responsible person admits.
How to achieve rapid development of "on-line Excel" function
SpreadJS is based on the most complete and HTML5 JavaScript, fastest spreadsheet control, respectively, by which the memory layer architecture, instruction set, calculation engine, presentation layer, import and export, and rendering the interface layer is formed as follows:
In this framework foundation, SpreadJS provide core functionality includes:
1. Industry-leading Excel compatible degrees, such as:
-
- Excel 53 supports the cell formats, format 18 kinds of conditions, three kinds of highlight data, and 60 kinds of table styles
- It supports more than 450 kinds of Excel formula functions
- Support 32 kinds of charts, and 182 in FIG. 18 kinds of mini shapes
- Dynamic arrays and array formulas have the full support library
- Pure front-end import, export Excel files
2. Beyond Excel is unique, such as:
-
- Custom mini-map and barcode
- Custom input cell type, the cell label, filling, drop-down lists, and buttons
- Dynamic shape
3. The class framework to support and expansion:
-
- Fully compatible front-end development Angular, React, Vue and other frameworks
- UMD in line with specifications, can be loaded on demand
4. The high speed processing performance and response
-
- Using more advanced than DOM rendering of HTML5 Canvas interface, can be accessed without compromising performance, maximize savings in storage space
Based on the above core functions, SpreadJS of application scenarios mainly includes the following three aspects:
- Data reporting
- Excel report design class
- Online Collaborative Editing
Processing performance Web form controls, and what factors related
SpreadJS goal is to become the best controls to meet the development needs of all! Prerequisite to achieve this goal, companies must meet high performance requirements.
First, SpreadJS from the outset, using a Canvas way to draw the entire interface, and DOM splicing different, the advantages of using Canvas is the ability to provide more smooth interactive experience to the user: the data table will not be increased, resulting in a browser Caton.
Second, data storage, SpreadJS uses a sparse array (Sparse Array) structure, can be accessed without compromising performance, maximize savings in storage space.
It is based on achieving the above techniques, SpreadJS can still maintain a high processing performance and responsiveness in your browser.
Future applications and front-end development technology trends
Overall, the front-end development can be attributed to two epochs: the front end of the era of small and large front of the times.
Small front of the times
With JavaScript was invented, a small front-end development into the front of the times, then why JavaScript was invented out of it?
In 1995, surf the Internet began to rise, but when the user is connected to the Internet through a 28.8 kbit / s modem, such as a user if you want to do a simple registration form validation, and interact with a server will need almost 30 seconds. Let us imagine, after waiting half a minute, the server forgot to inform you of a field filled, will be what kind of mood.
(Picture from the network)
Scripting language based on the needs of the client is running gradually increased in 1995 by Netscape developed JavaScript LiveScript predecessor came into being, and later for Java near the buzzword, LiveScript renamed to JavaScript. With JavaScript client can do logic, dynamic interaction and other acts.
So by the HTML skeleton, CSS for the appearance, JavaScript is interaction with the officially fixed down. Later, with the rise of Ajax technology, Web 1.0 from the era, entered the 2.0 era, web pages, in addition to the content-based display function, also has a data processing, dynamic effects, excellent user experience and so on.
Big front of the times
With the front-end dynamic efficiency, growing demand for data exchange, jQuery cross-browser tool library came into being, it has brought new vitality to the Web, so that developers can more easily develop operational DOM, data interactive, dynamic interaction and other acts, thinking developer is further opened.
Later, Google V8 engine release, Node born, offers the opportunity to use the same language to achieve full stack developed for front-end development (JavaScript no longer a front-end language can only write a page interaction). Followed by the front MVVM framework React, Angular, Vue, so that the front end of the project to achieve a real application of. The front ushered in the era of front-end, front-end development practitioners finally bid farewell to "cut plan earners" in the title, because they have a new title of "front-end development engineer."
2009, large-screen smart phone, emerging from the era of 4G to 5G times, people on Web product requirements and expectations have become more sophisticated in the future with "short, flat, fast" characteristics of the product will be popular.
Issam view of the future development trend of front-end
The development of JavaScript and browser, but also for the development of Web applications based system provides good performance and operational support environment.
Chinese developers face, Issam also concedes, "Chinese developers like to use the latest and best technology, and excellent front-end development tools, such as SpreadJS, they will certainly provide strong support for their projects, to help these developers in the field of information systems of finance, budget, engineering, statistics, etc., through powerful computing engine and flexible data visualization presentation, provide more rich and effective content for commercial information forms the control panel. "
Finally, as a technology enthusiast, Issam excited about the future, I believe that with the development of front-end technology of the future, and constantly updated Web assembly iteration, these technologies will provide users with an unprecedented and more powerful solutions.