Mini MVVM Framework Avalonjs 1.3.6 released

Source: Internet
Author: User

This version is an important upgrade, consider to introduce a lot of things, there are many things useful to everyone, also sent to the home page.

Originally there is no 1.36, based on the static collection relies on the 1.4 design, found that changes too much, in order to smooth upgrade, only to reduce a part of the new features, made 1.36. So there are 1.4 first, only 1.36.

This version of the company (where to go, after all, is paid in the company to do this framework) access to the browser's share, to increase the testing of domestic browsers. Related browser has QQ browser, Sogou browser, Cheetah Browser, proud browser, but no 360 browser, our company's colleagues are still very careful security. With so many browsers, it's still two case to pass on Cheetah's browser. The reason is that the Cheetah browser is dual-core, the framework of some internal decision branches accidentally fell into the pit. As usual, for the normal Ie6-8,avalon is all passed.

Here's a quick list of new features and fixes:

    • "New Features" Add Avalon.isfunction method, needless to say, we all know how to use, but in ie6-8 and the public, its implementation is not the same. Say it later.
    • The new feature adds the Data-duplex-focus auxiliary instruction, which, when Ms-duplex is in the Text field, the Password field, the text area, adds this instruction, automatically gets the focus, and the cursor is positioned after the last text. See here.
    • The "new features" ms-duplex-* adds data conversion capabilities. See here.
    • "Optimize" refactoring sanitize filters, see here.
    • The "optimization" refactoring of HTML bindings will result in a memory leak replacenodes replaced, here.
    • The "optimize" refactoring if binding will result in the removal of the msindocument, Ifsanctuary, and Placehoder properties of the memory leak, as described here.
    • The "optimize" refactoring repeat binding will cause the memory leak of the startrepeat, Endrepeat, parent, callbackelement attributes to be removed, and the original template property changed to a string. See here.
    • "Optimization" refactoring modelfactory, through static analysis to collect the monitoring properties and the calculation of properties and functions of the dependency, $watch callback of the storage array and the view refresh function of the storage array into a single, see below commit to simplify the calculation of properties, The subscription array for the monitoring array relies on the monitoring properties inside the function for collection.
    • Under the "Optimization" refactoring avalon.contains,ie6-8, it is sometimes wrong to access the parentnode of a text node that is out of the DOM tree. See here.
    • "Optimization" increases the cache hit rate for cacheexpr, as described here.
    • Set element transparency under "optimization" Refactoring ie6-8, later.
    • "Warning" refactoring Avalon. Array.ensure behavior, whether the return value is a number or undefined determine if it has added a new element, see here.
    • "Warning" obsolete dettachvmodels configuration items, see here.

The following is an introduction to some specific characteristics of the implementation.

The first is the isfunction method, and Avalon encounters the same problems as the jquery of the year. JQuery 1.4 Source 449 lines (Core.js 431 lines), the method to determine whether the function is as follows (thinking from Douglas Crockford's "The Miller Device"):

Isfunction:function (obj) {    return tostring.call (obj) = = = "[Object function]";},

The authors of JQuery also made some comments:

See
Test/unit/core.js for details concerning isfunction. Since version 1.3, DOM methods and functions like alert aren ' t supported. They return false on IE (#2968).

That is, this method does not correctly recognize the DOM method and some functions (such as the Alert method) under IE. If we use alert (typeof document.getElementById), the objectwill pop up under ie6-8 instead of the expected function. So we have to ie6-8 or old IE kernel Browser special processing, reference to the implementation of the Internet, Avalon now the source code is as follows:

var isfunction = typeof Alert = = = = "Object"? Function (FN) {        try {//) After judging the passed-in object string (fn+ ""), whether the starting position contains function, namely:/^\s*\bfunction\b/.test (fn+ "")            return/^\s* \bfunction\b/.test (fn + ")        } catch (e) {            return False        }    }: Function (fn) {        return Serialize.call (fn ) = = "[Object Function]"    }

But this method is still a bit problematic, in the Cheetah browser to determine the eval method error, probably in the IE8 document mode IE9 user Agent string mode error.

ms-duplex-* Add data conversion function , now ms-duplex-bool adjust to Ms-duplex-boolean, Ms-duplex-text adjust to ms-duplex-string, Add Ms-duplex-number, and three of them are effective on all form elements. It is expected that in 1.4, more custom formatting and error-hinting features will be added.

<! DOCTYPE html>

Finally, the old IE set the transparency of the problem, we all know to use transparent filter. But the transparent filter actually has two versions, one is the simplified version, style.filter= "Alpha", one is the full version, style.filter= "Progid:d XImageTransform.Microsoft.Alpha (opacity=50) ". jquery uses the former, but the problem is that the transparent filter has a set item, enabled, which is not transparent if it equals 0 or False. To prevent such a master from appearing, take care when taking transparency.

  var salpha = "DXImageTransform.Microsoft.Alpha"  csshooks["opacity:get"] = function (node) {            //This is the quickest way to get IE transparent value , no need to use the regular!            var alpha = Node.filters.alpha | | node.filters[salpha],                    op = Alpha && alpha.enabled? alpha.opacity:100            return (op/100) + ""//ensure the return of the string        }

When setting the transparency, there is no filter at first, we have to manipulate the Node.style.filter property and later, we can use the Node.filters object to operate. jquery is only intended to operate on a style play. Referring to the implementation of MooTools, I bulge the first way to manipulate transparency.

        csshooks["Opacity:set"] = function (node, name, value) {            var style = Node.style            var opacity = isfinite (value) & & Value <= 1? "Alpha (opacity= + value * + +") ":" "            var filter = Style.filter | |" ";            Style.zoom = 1            //The transparency cannot be set using the following methods            //node.filters.alpha.opacity = value *            style.filter = (Ralpha.test ( Filter)?                    Filter.replace (Ralpha, opacity):                    filter + "" + opacity). Trim ()            if (!style.filter) {                Style.removeattribute ("Filter")            }        }

Obviously this is not an effective use of the transparent filter features. After further research, make the second, it will appear on 1.4.

        csshooks["Opacity:set"] = function (node, name, value) {            var style = Node.style            var filter = Style.filter | |  "            if (filter.indexof (salpha) = = = 1) {                Style.filter + =" ProgID: "+ Salpha +" (opacity=100) "            }            var alpha = Node.filters[salpha] | | {}            if (value <= 1 && isfinite (value)) {                Style.zoom = alpha.enabled = 1                alpha.opacity = value * 100< c10/>} else {                alpha.enabled = 0            }        }

This makes it simpler and more efficient. In short, there are a variety of strange properties and methods on the DOM that deal with them, which is the pleasure of writing the code in front of us. The more details we have, the more choices we have and the more elegant and efficient the code we write.

Mini MVVM framework in GitHub's warehouse Https://github.com/RubyLouvre/avalon

Official Address http://rubylouvre.github.io/mvvm/

Avalon's new UI library address Oniui, up to 36 UI, powerful skin-changing features

Things that friends do with Avalon

    • Mobile apps: Read Cool
    • Chrome Plugin: Rice no client
    • To know the notes
    • Jinshan WPS Office Member Center
    • Sunshine Asset Website
    • Enterprise applications: Hyper-Blogging CRM Customer Relationship management System (account number:crm_ceo Password:nncb_ceo)
    • Uliweb python Framework and Avalon examples of combinations
    • Avalon+jquery Implementing Domain name registration query
    • Router Example
    • Winger Activity page
    • The test questions of reporters
    • 2048 games based on the AVALONJS implementation

Mini MVVM Framework Avalonjs 1.3.6 released

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.