Когда Flutter сталкивается с дросселированием и защитой от сотрясений

Flutter

Я полагаю, что разработчики веб-интерфейса более или менее сталкивались с проблемами дросселирования и анти-тряски. Дросселирование функций и функция защиты от встряхивания, обе из которых являются средствами оптимизации эффективности выполнения кода. В определенный период времени количество выполнений кода не обязательно должно быть чем больше, тем лучше. Наоборот, частое срабатывание или выполнение кода вызовет большое количество перерисовок и других проблем, влияющих на ресурсы браузера или компьютера. Поэтому количество раз выполнения кода контролируется в разумных пределах. Он может не только сэкономить ресурсы процессора браузера, но и сделать просмотр страниц более плавным, и не будет зависать из-за выполнения js. Это то, что делают регулирование функции и функция подавления дребезга.

В приложении для управления грузовыми авиаперевозками, которое я недавно разработал для внутренней авиакомпании, я просто использовал идею дросселирования и защиты от сотрясений, чтобы оптимизировать процесс.

Троттлинг и защита от тряски

Функция Throttle обращается к методам JS только один раз в определенный период времени. Например, моргание людей — это определенное время.

Функция anti-shake означает, что в случае частого срабатывания, только при достаточном простое, код выполняется однократно. Например, в жизни поездка на автобусе означает, что в течение определенного периода времени, если люди будут проводить карты одну за другой, чтобы сесть в автобус, водитель не будет водить машину. Водитель сядет за руль только в том случае, если никто другой не украл карту.

Флаттер дроссель

Функция дросселирования, поместите ее просто, состоит в том, чтобы сделать непрерывную функцию нельзя вызывать в течение очень короткого интервала времени, только когда последняя функция выполняется через указанный интервал времени, вы можете для следующего вызова функции.

Поместите это в функцию фестиваля бизнес-анализа:

class MyStatefulWidgetState extends State<OrderPageEdit> {
  bool canScanning; //是否可以扫描
  //扫描控制流
  final Stream<dynamic> _barScanner =
      EventChannel('com.freshport.freshport/barcode').receiveBroadcastStream();
  StreamSubscription<dynamic> _barScannerSubscription;

  @override
  void initState() {
    super.initState();
    _barScannerSubscription = _barScanner.listen((data) {
      if (!canScanning) return;
      setState(() {
        canScanning = false;
      });
      scanning(data);
    });
  }

  @override
  void dispose() {
    _barScannerSubscription.cancel();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Widget;
  }

  //扫面获取
  scanning(goodsCode) async {
    final result = await fetch.fetch(url: 'www.nicai.com');
    setState(() {
      canScanning = true;
    });
    if (result.result) {
    } else {}
  }
}

Объясните этот код, потому что этот проект представляет собой сканирование штрих-кода для работы с товарами, мы ожидаем однократного сканирования, считывания из базы данных в список товаров. Поэтому, даже если скан не может быть прочитан до этого. Так что я_barScannerВ функции прослушивания добавьте флаг флаг, чтобы определить, используется ли он, чтобы определить, завершен ли чтение, установите флаг.true. На этом этапе вы можете продолжить сканирование. Конечно, у моей функции троттлинга нет явного не срабатывающего времени, как у некоторых функций перехвата, не срабатывающее время этой функции — это время загрузки.

Противоскользящий

Определение функции защиты от сотрясения состоит в том, что после того, как событие запускается несколько раз, обработчик события выполняется только один раз и выполняется, когда операция триггера завершается. Принцип заключается в выполнении операции задержки над функцией обработки.Если событие запускается снова до наступления установленной задержки, таймер последней операции задержки будет очищен, и таймер будет переустановлен.

Функция Anti-Shake в основном используется для обработки поиска в режиме реального времени, перетаскивания и входа в систему имена пользователя и проверки формата паролей. В среде JS мы обычно используем Settimeate Function Function для обработки анти-встряхивания. Тот же принцип, в трепетании, мы принципием функции времени (или вызовите функцию задержки для обработки).

В постоянном поиске, соответствующем полю ввода, я использовал обработку против сотрясений:

class MyStatefulWidgetState extends State<GoodsCodeList> {
  //检索输入
  final TextEditingController _textController = TextEditingController();
  //设置防抖周期为3s
  Duration durationTime = Duration(seconds: 3);
  Timer timer;

  @override
  void initState() {
    super.initState();
  }

  @override
  void dispose() {
    _textController.clear();
    timer?.cancel();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return TextField(
        controller: _textController,
        decoration: InputDecoration(
            contentPadding: EdgeInsets.all(5.0),
            hintText: "请输入商品编码",
            prefixIcon: Icon(Icons.search, color: Colors.black),
            focusedBorder: OutlineInputBorder(
              borderSide: BorderSide(color: Colors.black),
            ),
            border:
                OutlineInputBorder(borderRadius: BorderRadius.circular(3.0))),
        onChanged: (String text) {
          //限制加节流
          if (text.trim().length < 5) return;
          setState(() {
            timer?.cancel();
            timer = new Timer(durationTime, () {
              //搜索函数
            });
          });
        });
  }
}

Как показано в коде, сначала установитеTimerобъекта, когда поле вводаTextFieldПри непрерывном вводе он всегда срабатываетTimerобъектcancelсобытие, как отмененное, так и повторноеTimerНазначить новый период3sфункция синхронизации. когда3sКогда в середине не вводится никакой информации, срабатывает эта функция синхронизации. но через три секундыповторно войти, эта временная функция будет снова отменена, и в качестве нового периода будет назначен новый период.3sфункция синхронизации.

Это практическое применение функции защиты от сотрясений.

окончание

Мы часто сталкиваемся с регулированием функций и защитой от сотрясения в коде js, потому что в js операции DOM (onresize, onscroll и т. д.) являются наиболее требовательными к производительности, но в некоторых сценариях одно и то же событие будет запускаться несколько раз. для уменьшения работы есть концепция анти-тряски и дросселирования. На самом деле, во многих разработках мы все еще можем использовать анти-тряску и дросселирование, чтобы уменьшить количество ненужных операций и ajax-запросов.

Категории