diff --git a/html5/browser/base/component/index.js b/html5/browser/base/component/index.js index b978aed812..4f72da6063 100644 --- a/html5/browser/base/component/index.js +++ b/html5/browser/base/component/index.js @@ -97,10 +97,6 @@ Component.prototype = { this._parentScroller = parent return true } - if (!parent) { - console && console.warn('[h5-render] isInScrollable - parent not exist.') - return - } }, // dispatch a specified event on this.node diff --git a/html5/browser/base/component/operate.js b/html5/browser/base/component/operate.js index fe912f4b97..2a24e55563 100644 --- a/html5/browser/base/component/operate.js +++ b/html5/browser/base/component/operate.js @@ -4,8 +4,7 @@ import { extend } from '../../utils' import { getFilters } from './valueFilter' export function create (nodeType) { - const node = document.createElement(nodeType || 'div') - return node + return document.createElement(nodeType || 'div') } export function createChildren () { diff --git a/html5/browser/base/root.js b/html5/browser/base/root.js index 94e810038f..3a20ef7777 100644 --- a/html5/browser/base/root.js +++ b/html5/browser/base/root.js @@ -29,15 +29,21 @@ function init (Weex) { this.data = data - // In some situation the root component should be implemented as - // its own type, otherwise it has to be a div component as a root. + // The root component should be implemented as a div component, as the scrollable + // components have performance issue compare to the original body scroll. if (!nodeType) { + console.warn(`[h5-render] no nodeType is specified, construct Root use 'div' by default.`) nodeType = 'div' } else if (config.validRoots.indexOf(nodeType) === -1) { - console.warn('[h5-render] the root component type \'' + nodeType + '\' is not one of ' - + 'the types in [' + config.validRoots + '] list. It is auto downgraded ' - + 'to \'div\'.') + console.warn(`[h5-render] the root component type '${nodeType}' is not one of +the types in [${config.validRoots}] list. It is auto downgraded +to 'div'.`) + nodeType = 'div' + } + else if (config.downgrade.root) { + console.warn(`[h5-render] the root is downgrade to div due to the downgrade +configuration of weex.`) nodeType = 'div' } else { @@ -46,9 +52,14 @@ function init (Weex) { detectRootHeight(this) }.bind(this)) } - !this.data.style.height && (this.data.style.height = '100%') } + if (nodeType === 'div') { + data.style.height = '' + } + else { + !data.style.height && (data.style.height = '100%') + } data.type = nodeType const cmp = cm.createElement(data) cmp.node.id = id diff --git a/html5/browser/render/config.js b/html5/browser/render/config.js index 951ab74a22..bb7d613dac 100644 --- a/html5/browser/render/config.js +++ b/html5/browser/render/config.js @@ -3,7 +3,10 @@ const config = { weexVersion: '0.5.0', debug: false, - validRoots: ['div', 'list', 'vlist', 'scroller'] + validRoots: ['div', 'list', 'vlist', 'scroller'], + downgrade: { + // root: true + } } export default config diff --git a/html5/browser/render/index.js b/html5/browser/render/index.js index 7585a096c5..17a9da83a1 100644 --- a/html5/browser/render/index.js +++ b/html5/browser/render/index.js @@ -51,11 +51,26 @@ function noop () {} // set global 'debug' config to true if there's a debug flag in current url. const debug = params['debug'] - if (debug === true || debug === 'true') { - config.debug = true - } + config.debug = debug === true || debug === 'true' !config.debug && (console.debug = noop) + + // config for the 'downgrade'. + for (const key in params) { + if (params.hasOwnProperty(key)) { + const match = key.match(/^downgrade_(\w+)$/) + if (!match || !match[1]) { + continue + } + const dk = match[1] + // downgrade in the config file has the highest priority. + if (typeof config.downgrade[dk] === 'boolean') { + continue + } + const dr = params[`downgrade_${dk}`] + config.downgrade[dk] = dr === true || dr === 'true' + } + } })() export default function Weex (options) { diff --git a/index.html b/index.html index b2f531e040..5b3684a543 100644 --- a/index.html +++ b/index.html @@ -15,7 +15,7 @@